How To Add Social Media Button Below Every Post Title of Blogger Blog.

Sharing+button+below+post+titlePost title the first thing where the visitors focus firstly. So adding social media button below post title is a very good idea. Social Media optimization is also proven to be gaining a traffic. At present era search engine algorithm also started focusing on social media status of our website. The higher is a sharing the higher chance to get benefits of search engine optimization. Blogger post title is highly focusing area and hence in advertising industry, the pricing for that area is very high as compare  to other area. here you will find other two alternatives of putting social media buttons in your blogspot site.

Add Social Media Button Below Every Post Title of Blogspot.

You just need to follow below simple step to meet with your requirements.

Step 1: Backup your template: (Related Stuff: How to backup  & Restore Blogger Template?)

Step 2: Go to Blogger Dashboard > Template > Edit HTML:

Step 3: find <data:post.body/> code by pressing (Ctrl + f).

Note: You will find more multiple <data:post.body/> tags. Kindly follow try and error method to find exact tag.

Step 4: Copy following code and past it above <data:post.body/> code.

<b:if cond=’data:blog.pageType == &quot;item&quot;’>
<div class=”addthis_toolbox addthis_default_style “>
<a class=”addthis_button_facebook_like” fb:like:layout=”button_count”></a>
<a class=”addthis_button_tweet”></a>
<a class=”addthis_button_google_plusone” g:plusone:size=”medium”></a>
<a class=”addthis_counter addthis_pill_style”></a>
</div>
<script type=”text/javascript” src=”http://s7.addthis.com/js/250/addthis_widget.js”></script>
</b:if>

Here I have used tag of hide and show conditional widget code so that social media sharing button appears only on the post page. Keep in mind that this buttons will not appear on home page and post page it will going to reduce your home page loading time . If you want to show it their than remove the first and last line of the above code.

Step 5: Click on Save template. That set.

Conclusion:

Building a strong relationship with blog visitors are begins with the finding visitors and adding social media widgets in a blogger blog is one of the best way gain them. If you facing any kind of problem regarding this tutorial than kindly drop your comment below, I will try to respond your as soon as possible.

Umesh Tarsariya

Hi their, I am Umesh Tasariya. I am author and founder of Tips Via Blogging. I have completed M.B.A with Marketing and currently acting as an experienced digital marketer. I am passionate about blogging and on the way to make it full time profession.

12 Comments

    • Hi thiru kumaran, just updated post try again, if you still facing same problem than your blogger template is formatted in such a way that it contains multiple <data:post.body/> code, kindly find another <data:post.body/> code and paste just below above code that is mentioned in step 5.

  1. Hai, great blog you have here, i am beginner and i refer to your posts only to all my blogging queries. I copy pasted the above code and it was working fine, but now for the last 4 or 5 posts it is not working, older posts have the social media buttons but the newer posts are not showing them in the blog post, couldnt figure out what has gone wrong, please help me out.

    http://www.mylittlemoppet.com

    • hi jhashar nalendran .. this problem generally its depend on the formation of your blog template you might find multiple code from step 4 . paste that code under each code.

  2. Hey i have used your solution but the counters are wrong on home page although they show correct data on individual post pages.
    I guess i need to use counturl attribute but it is not working. Could you please check and let me know!

    • Hey Harsh, It my look like temporary error, Actually this buttons are taken from the addthis social media sharing supporting website.

    • you may add div tag with style to align sharing buttons.

      <div align="left or right or center or justify">

      Above code of step 5 will be here

      </div>

      Hope for the best that this will work 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *