August 13, 2011

How To Add Official Google +1 Button to Blogger (Without Counter)

How To Add Official Google +1 Button to Blogger (Without Counter)




  1. Google Has Release of a New Social Button / +1 Button (plus one)
  2. How To Add New Official Google +1 Button to Blogger

1.Login to your blogger dashboard--> Design- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see this </Head> tag

4.Copy below code and paste it just before the </Head> tag

<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>

5.Now Scroll down to where you see this <div class="post-header-line-1"> tag

6.Copy below code and paste it just before the <div class="post-header-line-1"> tag

+1 Button Small (15px) Without Counter



<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='post-share-buttons' style='float:right;margin-right:10px;'>
<g:plusone size="small" expr:href="data:post.url" count="false"></g:plusone>
</div>
</b:if>


+1 Button Medium (20px) Without Counter



<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='post-share-buttons' style='float:right;margin-right:10px;'>
<g:plusone count="false" expr:href="data:post.url"></g:plusone>
</div>
</b:if>


+1 Button Standard (24px) Without Counter



<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='post-share-buttons' style='float:right;margin-right:10px;'>
<g:plusone size="medium" count="false" expr:href="data:post.url"></g:plusone>
</div>
</b:if>


+1 Button Tall (60px) Without Counter



<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='post-share-buttons' style='float:right;margin-right:10px;'>
<g:plusone size="tall"></g:plusone>
</div>
</b:if>

7.Save Your Template and you are done..

Please checkout more info

No comments:

Post a Comment