2011年末的时候，写过一篇预测2012年Pinterest会火到国内的文章（见这里：文艺青年逛Pinterest），果不其然，伴随着江南淅淅沥沥下了一个多月的雨，总部位于杭州的花瓣网，以其良好的UI和用户体验，积极的运营推广，逐渐在国内这场山寨Pinterest的战役中先人一步。

最近，据国外Shareaholic最新数据显示，Pinterest现在是推荐流量（referral traffic）增长最快的网站，它的推荐流量现在已经超过Twitter和谷歌。由此可以预见，在国内微波热渐渐趋于缓和的互联网，Pinterest模式必将会引领起一场新的热点，而各类大小公司纷纷蓄力备战Pinterest模式，也必将会被这把热点添一把柴。将自己喜欢的图片，文章分享给花瓣上的好友，不失为一种好选择。

所以好奇心的驱使下，看到一些图片博客推出了浮动按钮“采集到花瓣”，发现目前针对wordpress并没有相应的采集插件或添加按钮方法，于是，咱就自己来试试吧。

果真，花瓣提供了pinmarklet.js这样一个javascript文件，里面已经封装了采集方法。于是我们只需要对花瓣提供的JS代码，针对wordpress网站的特点，在相应的位置进行调用即可以，同样赞一句，花瓣不光提供了JS文件，还对分享按钮设定了样式，也算是统一网站标识吧！

唠叨了这么多，下面直接上方法：

1.确定添加JS的位置。可以是文章详情页single.php，也可以是全局的footer.php，各人选择，我推荐的是文章详情页。

2.由于浏览器解析网页是从头至下，所以一般建议将js放到网页最后再来解析，所以，我们把以下这段代码放置在single.php最底部。对，只需要这样一段js代码就一切ok了。

<!-- huaban share begin--> <script charset="utf-8" defer="defer" type="text/javascript"> (function(d,t) { var appendScript = function() { var a = d.createElement('script'); a.id = 'huaban_share_script'; a.async = true; a.setAttribute('charset','utf-8'); a.src = 'http://huaban.com/js/pinmarklet.js?' + Math.floor(+new Date/1E7); var s = d.getElementsByTagName(t)[0]; s.parentNode.insertBefore(a, s); } if (window.attachEvent) { window.attachEvent('onload', function(){setTimeout(appendScript, 1000);}); } else { appendScript(); } })(document, 'script'); </script> <!-- huaban share end-->

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

<!-- huaban share begin--> <script charset="utf-8" defer="defer" type="text/javascript"> (function(d,t) { var appendScript = function() { var a = d.createElement('script'); a.id = 'huaban_share_script'; a.async = true; a.setAttribute('charset','utf-8'); a.src = 'http://huaban.com/js/pinmarklet.js?' + Math.floor(+new Date/1E7); var s = d.getElementsByTagName(t)[0]; s.parentNode.insertBefore(a, s); } if (window.attachEvent) { window.attachEvent('onload', function(){setTimeout(appendScript, 1000);}); } else { appendScript(); } })(document, 'script'); </script> <!-- huaban share end-->

效果如下，将鼠标移至图片上时，自动浮出“采集到花瓣”按钮