Unique Google +1 button for each blog posts of Blogger

How To add Google +1 Button for Individual Blog posts of Blogger

1. Go to blogger dashboard --> Template --> Edit Html (Tick expand widget template option).

2. Find for </head> tag and add the following peace of code just above it.

<!-- Unique style Google +1 button by BloggerTricks.biz -->
<script type='text/javascript'>
  (function() {
    var po = document.createElement(&#39;script&#39;); po.type = &#39;text/javascript&#39;;
po.async = true;
    po.src = &#39;https://apis.google.com/js/plusone.js&#39;;
    var s = document.getElementsByTagName(&#39;script&#39;)[0]; s.parentNode.
insertBefore(po, s);
  })();
</script>

3. Now find(Ctrl+F) for <div class='post-header-line-1'> and add the following peace of code just below it.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div style=' background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSVJEJc7jB0PSG6M4FMBsL6Yz895CbXW9AaGGvtbiFeGvhQJp4lhQxfYPSPfSDoFQVVhTwwxkH2bFsY2-PDYgj42dEXJrk0K9tYEASreKCnMDrQCeholwSUg-s2v1TPbvOepmggRmAZbk/s1600/call.jpg) no-repeat; display: block; width:65px; height:70px;
float: left; margin: -40px 2px 0 -79px; padding: 4px 0 0px 8px; border: 0; '>
<g:plusone annotation='bubble' expr:href='data:post.url' size='tall'/>
</div></b:if>

 







Hint:-
You can switch the button size between small, medium, large and tall.
You can switch the annotation between inline, bubble and none.

4. Save the Template.