Add Social Sharing Widget Below Every Post Title in Blogger

Social sharing buttons widget is very important because it help our readers to share the content on social media sites that helps us to improve blog traffic and page views. Writing original and quality content is not easy. It takes lot of time and efforts to produce best quality content. But what if we have not decent traffic to read our content? In this case all of our hard work will be vanish. We have to reach our content to the audience so that they can land on our blog and read what we have shared with them. Social media sites are the best place to share the content because of lot of visitors. But sharing the content on each social media sites manually is a loaf. We can make this task easy for our readers as well for ourselves by adding a social sharing widget in our blog. Area under the post titles are most viewed by the readers so in this tutorial I'll tell you how to add social sharing widget below each post title in blogger.

Add Social Share Widget In Blogger

1. Log in to your blogger account.


2. Go to Template >> Edit HTML.


3. Please first backup your blog template.


4. Search for



<data:post.body/>



5. Now paste the below code just above it.




<b:if cond='data:blog.pageType == "item"'>
<table border='0'>
<tr>
<td><div style='margin-right:5px;'>
<g:plusone expr:href='data:post.url' size='medium'/>
</div>
</td>
<td><div style='padding-top:6px;'>
<script type='text/javascript'>
tweetmeme_style = &quot;compact&quot;;
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>
</div></td>
<td><div style='margin-right:25px;'>
<script expr:src='&quot;http://www.stumbleupon.com/hostedbadge.php?s=1&amp;r=&quot; + data:post.url'/></div>
</td>
<td><div style='margin-right:25px;'>
<div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='button_count' send='true' show_faces='false' width='40px'/>
</div>
</td>
<td>
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<!-- AddThis Button END -->
</td>
</tr>
</table> </b:if><br/>




6. Now search for </head> in your template and just above it paste the following code.




<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: &#39;en-US&#39;} </script>




7. Save the template.


8. You are done!