Unique Google +1 button for each blog posts of Blogger

Your blog promotion on social media especially Google plus one have became one of the powerful factor to survive from the latest Google algorithm updates. Your social media exposure on Google Plus is going to play an effective role in upcoming days according to these algorithms. You might know why Google plus is given highest priority as it is one of the proud service of Google. So we need to get more +1s for our blogs to stand strong and survive any algorithm updates. To do so, shouldn't you use some unique style Google +1 button for your blog to gain more attention of visitors towards it. So I thought of creating a new and unique style of Google +1 button for blogger blogs and I have come with the tutorial on it.

.................................................................................................................................................

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/AVvXsEj9QCATOHiuLrO3K6d_2iM5tzd9c6f2d6A7ThCKmICMeFVFC2iN8sQoFMj-HNFj3ggqsn7mehygEeTt5supWHsPAj2W9-csrkLyYu37UgxRNpYvmhiSn-qBno_ZRRG8-kf9t1mt1dLYAok/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.

Related product you might see: