Ever expected to add the best social media buttons all at one go? Well today’s Widget is not just a smart one but it will surely increase your blog Traffic tremendously. The widget includes Facebook Like Button which is highly appreciated throughout the blogosphere and our favourite the retweet button, Stumble and Digg Counter Buttons. All these buttons are eye catching so the visitors would love clicking them and thus bringing you more and more traffic by sharing your tutorials with people in their social media networks. You can see these buttons in action just under my post titles. So how do we add them? Here we go –>
How to add Social Media Buttons To Blogger?
The method is as simply as throwing a peanut in air and swallowing it. =p Simply follow these steps,- Go To Blogger > Design > Edit HTML
- Back up your template
- Check the Expand Widget Templates box
- Then click Ctrl + F and in the browser search box paste this,
data:post.body5. Just above this code paste the giant code below,
<b:if cond='data:blog.pageType == "item"'>
<table border='0'>
<tr>
<td><div style='padding-top:6px;'>
<script type='text/javascript'>
tweetmeme_style = "compact";
</script>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>
</div></td>
<td>
<script expr:src='"http://www.stumbleupon.com/hostedbadge.php?s=1&r=" + data:post.url'/>
</td>
<td><div style='margin-left:35px;'>
<script type='text/javascript'>
(function() {
var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0];
s.type = 'text/javascript';
s.async = true;
s.src = 'http://widgets.digg.com/buttons.js';
s1.parentNode.insertBefore(s, s1);
})();
</script>
<a class='DiggThisButton DiggCompact'/>
</div></td>
<td>
<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=button_count&show_faces=false&width=100& action=like&font=arial&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; margin-left:35px; width:100px; height:20px;'/>
</td>
</tr>
</table> </b:if><br/>
6. Save your template and see your blog decorated with some best social media buttons.
That’s All!
If you liked the tutorial then kindly be generous enough to liking it :)Ps: Please Respect copyrights.
Never thought this EID would turn the best designing period of my life. After a lot of trial and error I managed to create a social bookmarking Icons widget using advanced CSS technique. I had consulted a lot of my friends on how to give an hover effect to social bookmarking icons below blogger posts using simple CSS but all methods that were suggested unfortunately did not help. I worked hard using the 
