精品博客

通过代码方便别人分享您的文章

Posted: 07 May 2009 05:00 PM PDT

分享是一种美德，也是博客的一种推广方式。

我爱水煮鱼博客在每篇文章的末尾提供的分享书签（Bookmarklet）一共有五个，分别是 Twitter、Google Reader Share、FriendFeed、豆瓣和鲜果，效果如图：

bookmarklet

至于以上的效果是如何实现的，我爱水煮鱼在《我使用的5个博客分享的 Bookmarklet》一文中有详细的介绍。

看了介绍之后，我把精博每篇文章后面的分享书签定为三个，分别是 Twitter、FriendFeed 以及 QQ 书签，效果如图：

bookmarklet

其实我并不知道读者喜欢通过什么社会媒体分享精博的文章，之所以选择这三个书签，只是个人爱好而已。其中，精博上的"分享到 Twitter"的效果和我爱水煮鱼介绍的不一样，因为使用的代码不同，精博上用的代码如下：

<a rel="nofollow" href="http://twitter.com/home/?status=Reading @young_yang — <?php the_title(); ?> http://www.essentialblog.cn/?p=<?php the_ID(); ?>”><img src=”http://www.essentialblog.cn/image/tweet-this.png” alt=”Tweet This” /> <strong>分享到 Twitter!</strong></a>

如果您喜欢这种效果，并且想把它整合到您的博客，请把那只鸟的图片下载并上传到您的博客空间或者换一张图片，然后再修改一下红色部分。

至于"分享到 QQ 书签"，我使用的代码如下：

<a href="javascript:window.open('http://shuqian.qq.com/post?from=3&title='+encodeURIComponent(document.title)+'&uri='+encodeURIComponent(document.location.href)+'&jumpback=2&noui=1','favit','width=800,height=600,left=50,top=50, toolbar=no,menubar=no,location=no,scrollbars=yes,status=yes,resizable=yes');void(0)" rel="nofollow"><img src="http://www.essentialblog.cn/image/qqbookmark.gif” alt=”分享到 QQ 书签” /> 分享到 QQ 书签</a>

红色部分是图片的 URL，使用时请换成您自己的。

除了 Twitter、Google Reader Share、FriendFeed、豆瓣、鲜果和 QQ 书签这六个书签之外，还有很多其他的分享书签可以用的，下面是 12 种比较流行的：

1、分享到 "Google 书签" 代码：

<a rel="nofollow" href="javascript:void%20window.open('http://www.google.com/bookmarks/mark?op=edit&bkmk='+encodeURIComponent(location.href)+' &title='+encodeURIComponent(document.title),'google','width=600,height=480,scrollbars=yes');"><img src="http://您的图片 URL" alt="分享到 Google 书签" border="0"> 分享到 Google 书签</a>

效果如下：

添加到 Google 书签分享到 Google 书签

2、分享到 "雅虎收藏" 代码：

<a onclick="window.open('http://myweb.cn.yahoo.com/popadd.html?url='+encodeURIComponent(document.location.href)+'&title='+encodeURIComponent(document.title), 'Yahoo','scrollbars=yes,width=440,height=440,left=80,top=80,status=yes,resizable=yes');" target="_blank"><img src="http://您的图片 URL" alt="分享到雅虎收藏" border=0> 分享到雅虎收藏</a>

效果如下：

分享到雅虎收藏

3、分享到 "Del.icio.us" 代码：

<a rel="nofollow" href="http://del.icio.us/post" onclick="window.open('http://del.icio.us/post?v=4&noui&jump=close&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title), 'delicious','toolbar=no,width=700,height=400'); return false;" ><img title=Del.icio.us border=0 alt=Del.icio.us src="http://您的图片 URL"> 分享到 Del.icio.us</a>

效果如下：

分享到 Del.icio.us

4、分享到 "百度搜藏" 代码：

<a rel="nofollow" href="javascript:window.open('http://cang.baidu.com/do/add?it='+encodeURIComponent(document.title.substring(0,76))+'&iu='+encodeURIComponent(location.href)+'&fr=ien#nw=1','_blank','scrollbars=no,width=600,height=450,left=75,top=20,status=no,resizable=yes'); void 0" style="color:#000000;text-decoration:none;font-size:12px;font-weight:normal"><img border="0" alt="分享到百度搜藏" src="http://您的图片 URL"> 分享到百度搜藏</a>

效果如下：

分享到百度搜藏

5、分享到 "饭否" 代码：

<a rel="nofollow" href="javascript:var d=document,w=window,f='http://fanfou.com/share',l=d.location,e=encodeURIComponent,p='?u='+e(l.href)+'?t='+e(d.title)+'?d='+e(w.getSelection?w.getSelection().toString():d.getSelection?d.getSelection():d.selection.createRange().text)+'?s=bl';if(!w.open(f+'r'+p,'sharer','toolbar=0,status=0,width=600,height=400')){l.href=f+'.new'+p;}void(0)"><img src="http://您的图片 URL" alt="分享到飯否" /> 分享到饭否</a>

效果如下：

分享到饭否

6、分享到 "叽歪" 代码：

<a rel="nofollow" href="javascript:var d=document,w=window,f='http://jiwai.de/wo/share/',l=d.location,e=encodeURIComponent,p='?u='+e(l.href)+'&t='+e(d.title)+'&d='+e(w.getSelection?w.getSelection().toString():d.getSelection?d.getSelection():d.selection.createRange().text);a=function(){if(!w.open(f+'s'+p,'sharer','toolbar=0,status=0,resizable=0,width=640,height=310'))l.href=f+'w'+p};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else{a()}void(0)"><img src="http://您的图片 URL" alt="分享到叽歪" border="0"> 分享到叽歪</a>

效果如下：

分享到叽歪

7、分享到 "做啥" 代码：

<a rel="nofollow" href="javascript:var d=document,w=window,f='http://zuosa.com/collect/Collect.aspx',l=d.location,e=encodeURIComponent,p='?u='+e(l.href)+'&t='+e(d.title)+'&d='+e(w.getSelection?w.getSelection().toString():d.getSelection?d.getSelection():d.selection.createRange().text)+'&s=bm';a=function(){if(!w.open(f+p,'sharer','toolbar=0,status=0,resizable=0,width=561,height=200'))l.href=f+p};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else{a()}void(0)" title="分享到做啥"><img src="http://您的图片 URL" alt="分享到做啥" /> 分享到做啥</a>

效果如下：

分享到做啥

8、分享到 "嘀咕" 代码：

<p><script type="text/javascript" src="http://app.foxling.cn/dilink/js/diguthis.js"></script><img src="http://app.foxling.cn/ico/diguthis16.gif" alt="分享到嘀咕" title="分享到嘀咕" onclick="DiguThis.pop()" style="cursor:pointer" /> 分享到嘀咕</p>

效果如下：

分享到嘀咕

9、分享到 "有道书签" 代码：

<a rel="nofollow" href="javascript:void(window.open('http://shuqian.youdao.com/manage?a=popwindow&title=' + encodeURI(document.title) + '&url=' + encodeURI(document.location), '', 'height=200, width=590, top=100, left=100, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no'))"><img src="http://您的图片 URL" alt="分享到有道书签" border="0"> 分享到有道书签</a>

效果如下：

分享到有道书签

10、分享到 "FaceBook" 代码：

<script>function fbs_click() {u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;}</script><style> html .fb_share_link { padding:2px 0 0 20px; height:16px; background:url(http://static.ak.facebook.com/images/share/facebook_share_icon.gif?6:26981) no-repeat top left; }</style><a rel="nofollow" href="http://www.facebook.com/share.php?u=http://www.essentialblog.cn/?p=<?php the_ID(); ?>" onclick="return fbs_click()" target="_blank" class="fb_share_link"> 分享到 Facebook</a>

效果如下：

分享到 Facebook

红色部分要换成您自己的网址。

11、分享到 "海内" 代码：

<a rel="nofollow" href="javascript:void((function(s,d,e,t,v){var f='http://hainei.com/share.proxy?a=',u=d.location,l=d.title,p=['&src=bookmark&url=',e(u),'&title=',e(l),'&v=',v,'&i=',t].join(”);function a(){if(!window.open([f,'bmlet',p].join(”),’hnsharer’,['toolbar=0,status=0,resizable=1,width=626,height=436,left=',(s.width-626)/2,',top=',(s.height-436)/2].join(”)))u.href=[f,'newurl',p].join(”);};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else a();})(screen,document,encodeURIComponent,1207710314,1));"><img src="http://您的图片 URL" alt="分享到海內" border="0"> 分享到海內</a>

效果如下：

分享到海內

12、分享到 "Mister Wong" 代码：

<a rel="nofollow" href="http://www.mister-wong.cn/add_url/" onClick="window.open("http://www.mister-wong.cn/index.php?action=addurl&bm_url="+encodeURIComponent(location.href)+"&bm_description="+encodeURIComponent(document.title));return false" title="分享到 Mister Wong" target="_blank"><img src="http://您的图片 URL" alt="分享到 Mister Wong" border="0" /> 分享到 Mister Wong</a>

效果如下：

分享到 Mister Wong