添加新浪和腾讯微博分享按钮

WordPress作为一个独立博客系统,它本身并没有分享功能,这不免让网站显得单薄,因此为Wordpress添加一个分享到SNS的功能可以说灰常实用。

 

最简便的方法是安装一些分享类的插件,但我们有时需要定制自己的分享按钮,这样使用插件就会显得不方便。因此跟大家分享一种分享到现在灰常流行的新浪和腾讯微博的方法。可能有人会觉得奇怪,新浪和腾讯官方不是有一键分享按钮的代码吗?没错,但是官方放出的代码活脱脱就是一种不标准的写法,另外也不能使用自己的样式,这样不便于使分享按钮适应自己的网站,这也是我在做新的自用主题时想到的。

 

首先直接放代码,以下两段是功能代码,由于新浪和腾讯分享机制不一样,所以代码将会有一定差别。

 

新浪微博

<a href="javascript:void((function(s,d,e){try{}catch(e){}var f='http://v.t.sina.com.cn/share/share.php?',u=d.location.href,p=['url=',e(u),'&title=',e(d.title),'&appkey=4144218247'].join('');function a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=620,height=450,left=',(s.width-620)/2,',top=',(s.height-450)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent)){setTimeout(a,0)}else{a()}})(screen,document,encodeURIComponent));" class="sina" title="分享到新浪微博" target="_blank" ></a>

appkey可以替换为自己申请的appkey,如果有自己的appkey则可以显示自己的来源显示

 

腾讯微博

<a href="javascript:void(0)" onclick="postToWb();"target="_blank" class="tt" title="分享到腾讯微博"></a>
<script type="text/javascript">
function postToWb(){
var _t = encodeURI(document.title);
var _url = encodeURIComponent(document.location);
var _appkey = encodeURI('bc4cdb3027304d94b339bd027543837c');//从腾讯获得的appkey这个可以不填,如果有自己的appkey则可以显示自己的来源显示
var _pic = encodeURI('');//
var _site = '';//你的网站地址,可以留空
var _u = 'http://v.t.qq.com/share/share.php?url='+_url+'&appkey='+_appkey+'&site='+_site+'&pic='+_pic+'&title='+_t;
window.open( _u,'', 'width=700, height=680, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, location=yes, resizable=no, status=no' );
}
</script>

稍作解释一下,把这两段代码放在你需要显示分享按钮的地方,注意需要准备两张分享按钮的图片,用css给class为“sina”和“tt”的div分别设置背景,就会显示出分享按钮,点击按钮会弹出一个发表微博的窗口,具体效果可以见本站文章页的分享按钮。

 

本文由 Kayo Lee 发表,本文链接:http://kayosite.com/share-sina-tt.html

评论列表

  • 评论者头像
    回复

    请教一下,新浪微博的分享怎么使他的默认内容改成title+description呢? :-P

  • 评论者头像
    回复

    嗯,不想用官方的按钮,但是其它的解决方案貌似总是抓不到图。。不过现在用的是你的代码,多谢。

回复

你正在以游客身份访问网站,请输入你的昵称和 E-mail
:wink: :roll: :oops: :mrgreen: :idea: :cry: :?: :-| :-o :-P :-? :) :( 8-O