在你的博客中增加google+按钮

Icon

Update(2012-03-05 10:50):

亲们注意哦,白色背板的图标表示你还未+1,蓝色背板的图表(上图)表示已经+1。两种状态可以互相切换。也就是说,在蓝色背板状态下再次点击相当于“-1”

该功能需要你已经登录了google。

图标显示会比较慢,如果一直看不到图标,说明被墙了。

 

可以墙住的是对google的访问,墙不住的是对google的喜欢!

在博客上添加Google +1 按钮,可以让你的访问者在 Google 搜索上推荐、在 Google+ 上分享你的博客内容。

有人在本博公布的皮肤那篇博文中提出了增加Google+1按钮的问题。严格来说,这不属于皮肤的范畴。因为皮肤只是定义css样式,不改变页面元素。但是好吧,既然你要,我就给你。

首先,在你的公告栏中增加如下内容:

<!-- 将此标记放在您希望呈现 +1 按钮的位置 -->
<g:plusone></g:plusone>

<!-- 将此呈现调用放在适当的位置 -->
<script type="text/javascript">
window.___gcfg
= {lang: 'zh-CN'};

(
function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src
= 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>

就可以看到+1 按钮了。

 

但总是有人不满足(比如我)。你可能希望+1按钮出现在顶部的导航菜单上,这就需要定义css。在后台css设置中增加:

#___plusone_0{ 
position
: absolute;
left
: 555px;
top
: 8px;
z-index
: 999999;
}

其中left、top是+1按钮在页面中的绝对位置,你可以根据自己的皮肤自行调整;

z-index设置一个很大的值,保证+1按钮在所有元素的上面。

 

如果你的菜单是fix的(固定,不随页面滚动而滚动),那么你当然会希望+1按钮也随着菜单一起“fix”,那么就继续增加css定义,变成这样:

#___plusone_0{  
  position
: absolute;
  left
: 555px;
  top
: 8px;
  z-index
: 999999;
  overflow: visible;
position
: fixed;
}

增加了overflow和position属性的定义,+1按钮就会不受页面滚动的影响,一直显示。

至此,google+按钮就在你的博客中安家了,希望这个功能能够给你带来朋友和流量,呵呵。

 



posted @ 2012-03-05 10:13  心内求法  阅读(2619)  评论(10编辑  收藏  举报