教你如何在博客里加入分享功能——分享插件（HRshare）

下面我要用到的插件是我自己写的，关于插件地址是：jquery.HooRay——自己做的一个jquery常用工具插件。关于分享插件的制作流程我也写了篇文章，有兴趣的可以看下：自己写的一个分享按钮的插件（可扩展，内附开发制作流程）

　　闲话不多说，进入正题吧，大家可以看下文章最后是不是有一排分享的按钮，那个就是最终的效果了，当然不止那一种效果，一共有以下几种效果，分别是：



　　完整的代码就是这样

view sourceprint?

<link rel= "stylesheet" href= "http://saw.caifutang.com/jquery.hooray/jquery.HooRay/jquery.HooRay.css" />

<script src= "http://saw.caifutang.com/jquery.hooray/jquery.HooRay/jquery.HooRay.js" ></script>

<p class= "hoorayshare" >

<a class= "hr-share-tsina" ></a>

<a class= "hr-share-tqq" ></a>

<a class= "hr-share-tsohu" ></a>

<a class= "hr-share-twangyi" ></a>

<a class= "hr-share-qzone" ></a>

<a class= "hr-share-renren" ></a>

<a class= "hr-share-baidu" ></a>

<a class= "hr-share-taobao" ></a>

<a class= "hr-share-xiaoyou" ></a>

<a class= "hr-share-hi" ></a>

<a class= "hr-share-feixin" ></a>

<a class= "hr-share-tianya" ></a>

<a class= "hr-share-douban" ></a>

<a class= "hr-share-mop" ></a>

<a class= "hr-share-more" ></a>

</p>

<script type= "text/javascript" >

$( '.hoorayshare' ).HRshare();

</script>

　　顶上引用JS和CSS必须要有，下面是一个P标签包着一堆A标记，里面的内容位置可以修改，也可以删除不想要的，最后一个是更多按钮，建议不要去掉。

　　然后是分享调用方法，里面可以设置不同参数来实现不同展示方式，可以看上图里的参考。

　　最后我们把代码复制，进入后台--设置--博客签名，如果你已经有在使用签名，可以复制到现有的签名里，然后再保存到前台查看效果吧。

　　PS：有人会问：为什么不用网上现成的分享插件？首先，这是我自己写的，既然我有同样的产品，为何还要用他人的；第二，我不喜欢网上插件分享的 时候要先跳到他们的网站，然后再跳到相对应的分享地址，莫名其妙的就给他们增加流量了，而且两次跳转的效率肯定不必一次跳转来的高。所以权衡之下，我还是 选择用自己的分享插件。

　　PS2：那又有人会问：网上现成的分享插件有统计功能，比如JiaThis。我觉得统计这功能对我来说功能不大，我弄这个插件主要是给想分享文 章的人做个方面，而并非要给自己看到某篇文章分享了多少次，那个数值再高对我来说也没什么太大意义，如果你很喜欢这功能，那推荐你可以用JiaThis。