首页 > micolog, 博客相关 > 为博客添加分享按钮

为博客添加分享按钮

2010年9月24日 发表评论 阅读评论

有时,我们想为独立博客添加一个类似于分享到的按钮,以便分享到各种SNS网站添加人气。虽然,现在网上提供这种插件的网站,如addthisonjiathis等,但是,这些网站都是商业网站,为了流量,分享时会跳到上述网站,比较不爽。因此,求人不如求己,自己动手,丰衣足食,于是我搜了一下,看网上有没类似的代码,于是得到下述地址:

http://blog.csdn.net/skymountain/archive/2010/06/25/5694697.aspx

但是,我试用上述代码,发现在我micolog系统里没效,几番更改代码,终于出现了分享按钮图标,但是除图标外,还有一堆文字,看着不美观。于是,我再对代码进行修理,最终得到如下代码,其效果见本文标题下面:

 function ShareCode(server_url, server_icon_url,text){
    var title = encodeURIComponent(document.title.substring(0,76));
    var url = encodeURIComponent(location.href);
    server_url = server_url.replace("{title}",title);
    server_url = server_url.replace("{url}",url);

    return "<a href=\"javascript:window.open(\'"
    + server_url
    +"'); void 0\" title =\"" + text + "\"><IMG alt="
    + text + " src=\""
    + server_icon_url
    + "\"><\/a>"
}
function WriteSNS()
{
    document.writeln(ShareCode("http://share.renren.com/share/buttonshare.do?title={title}&link={url}",
    "http://s.xnimg.cn/favicon-rr.ico?ver=2",
    "Share to Renren"));

    document.writeln(ShareCode("http://www.kaixin001.com/repaste/share.php?rtitle={title}&rurl={url}",
    "http://www.kaixin001.com/favicon.ico",
    "Share to Kaixin"));

    document.writeln(ShareCode("http://v.t.sina.com.cn/share/share.php?title={title}&url={url}",
    "http://t.sina.com.cn/favicon.ico",
    "Share to SinaMicroblog"));

    document.writeln(ShareCode("http://www.douban.com/recommend/?url={url}&title={title}",
    "http://t.douban.com/favicon.ico",
    "Recomend to Douban"));

    document.writeln(ShareCode("http://apps.hi.baidu.com/share/?title={title}&url={url}",
    "http://www.baidu.com/favicon.ico",
    "Forword to BaiduHi"));


}
 

相比于原作者的代码,我做了以下改动:第一,设置分享打开页面为浏览器默认设置,而不会跳转到新的窗口;第二,对打开参数进行精简;第三,删除了按钮旁的文字进行,更加美观;第四,函数不是封装成div,这样可以更方便的贴到某一行内。

使用方法也很简单,在页面的任何一处假如js引用代码:

 <script type="text/javascript" src="/share.js"></script> 

在需要插入分享按钮的地方加入js函数调用代码即可:

 <script type="text/javascript">WriteSNS();</script>


本文作者: Sigma    在新浪微博关注SigmaSigmaWeibo    RSS订阅本博客
本文链接: http://www.sigma.me/2010/09/24/add_share_button.html
本博客采用知识共享署名—非商业性-禁止演绎使用3.0协议进行许可,转载请保留作者和原文链接。

  1. 2011年5月3日00:13 | #1

    这个语法高亮是syntax highlighter?跟syntax highlighter evolved有啥区别么?

  2. 2011年5月3日04:05 | #2

    @ouyang

    我也不知道,我一直想加上verilog支持,但一直没加上

  3. 2019年1月10日03:44 | #3

    I am writing to make you understand of the fine discovery my cousin’s daughter went through studying your web site. She learned several issues, with the inclusion of what it is like to have a marvelous giving style to have other folks with no trouble know several impossible matters. You really surpassed our desires. Many thanks for giving those warm and helpful, trustworthy, revealing and unique guidance on this topic to Julie.

  4. 2019年1月10日21:08 | #4

    My husband and i have been absolutely joyous Raymond managed to deal with his researching through your ideas he made using your site. It’s not at all simplistic just to continually be giving for free points people have been trying to sell. We really know we now have the blog owner to thank for that. These explanations you made, the simple website navigation, the relationships you make it possible to engender – it is mostly terrific, and it’s leading our son and our family feel that the issue is satisfying, and that is quite pressing. Many thanks for the whole thing!

  5. 2019年1月11日15:56 | #5

    I precisely desired to thank you so much once more. I am not sure what I would have used in the absence of the entire smart ideas revealed by you concerning such a industry. It absolutely was an absolute difficult condition in my circumstances, but considering this specialized fashion you solved that forced me to leap for contentment. Now i’m thankful for your support and hope that you find out what a powerful job you have been undertaking educating people by way of your webblog. Most probably you’ve never encountered all of us.

  6. 2019年1月12日09:49 | #6

    Thank you a lot for providing individuals with such a marvellous chance to check tips from this site. It is often very brilliant and as well , stuffed with amusement for me and my office acquaintances to visit the blog at the very least 3 times weekly to read the newest guides you will have. And lastly, I am also actually fascinated with your exceptional tips you give. Selected two areas in this posting are unequivocally the most suitable we’ve ever had.

  7. 2019年1月13日03:56 | #7

    I and my friends have already been looking at the excellent tips and hints found on your web blog while at once developed an awful suspicion I never expressed respect to the web blog owner for those techniques. All the young boys are actually as a consequence very interested to see them and have in effect in actuality been taking advantage of them. Thank you for truly being quite helpful and also for opting for varieties of really good useful guides most people are really desirous to learn about. Our sincere apologies for not saying thanks to you earlier.

  8. 2019年1月13日06:20 | #8

    I want to express my appreciation to the writer just for bailing me out of this type of condition. Because of looking through the the net and meeting solutions which were not beneficial, I was thinking my entire life was gone. Living without the presence of strategies to the difficulties you have solved by means of your entire blog post is a critical case, as well as the kind which could have in a wrong way damaged my entire career if I hadn’t discovered your website. Your own personal knowledge and kindness in maneuvering the whole thing was very useful. I am not sure what I would have done if I had not come upon such a solution like this. It’s possible to at this point look forward to my future. Thanks a lot so much for your impressive and sensible guide. I won’t think twice to recommend your blog to anybody who requires care on this subject matter.

  1. 本文目前尚无任何 trackbacks 和 pingbacks.

无觅相关文章插件,快速提升流量