If you want your blog to be popularly known among the vast numbers of blogs on the internet, you need to use social bookmarking site.As a blogger, you need to add a social sharing widget to your blog so that your blog visitors would be able to share your blog contents with friends on their network easily with a single click. So today, I want to share a stylish set of share buttons that bloggers can easily install and use on their blog. The image below shows how it will appear on your blog.
How to Add the Share Buttons to Blogger
1. Sign in to your blogger dashboard
2. Go to Template >> Edit HTML >> Check the Expand Widget Template box
3. Now search for <head> in your template and paste the code below above </head>
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: 'en-US'} </script>4. Search for <data:post.body/> in your template and paste the code below above it if you want the share button to show after your blog title or paste it below it if you want the share button to appear after your post.
<b:if cond='data:blog.pageType == "item"'>
<div style='padding:4px;'>
<table border='0'>
<tbody>
<tr>
<td>
<div style='margin-right:10px;'>
<a class='twitter-share-button' data-count='horizontal' data-via='justnaira' href='http://twitter.com/share'>Tweet</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
</div>
</td>
<td>
<div style='margin-right:10px;'>
<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:0px; width:100px; height:20px;'/>
</div> </td>
<td>
<div style='margin-right:10px;'>
<g:plusone expr:href='data:post.url' size='medium'/>
</div><
</td>
<td>
<div style='margin-right:10px;'>
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/> <script
src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/> </div>
</td>
<td> <a href="http://www.nagaruntari.in">Grab It </a></td>
</tr></tbbody>
</table>
</div>
If you’re good at CSS, you can change the color code and you can a well re arrange the order of the button or remove the ones you don’t need.
5. Finally, Save your template
If you encounter any difficulty in the process of adding this widget to your blog, don't hesitate to use the comment box below.
