How to add Google +1 Button on Blogger?

If you're a Blogger user and really want to implement this new +1 Google button on your Blogspot Blog, then this tutorial is for you.


For adding up this attractive Google +1 Button, you need to go to the HTML Edit option in  your Blogger Design Page.

Now, Search for <data:post.body/> or <div class="post-header-line-1"/> and place the below codes, just after it.

<!--G +1 Button Start-->
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'/>
<div style='float:left; margin-right:10px;'>
<g:plusone href='data:post.url'/>
</div>
<!--G +1 Button End-->

And you're done...

If you successfully placed your code on your blog then it'll display in the top left side of the post.

You can even choose the 4 Different Sizes of Google +1 Button. Just simply change the code size:

size="small" - To display small size +1 button of 15px
size="medium" - To display medium size +1 button of 20px
size="large" - To display large size +1 button of 60px