Ravi Saive: A Technology Blog For Newbies

This great plugin works on both blogger and WordPress blogs and it comes with Facebook Like, Send, Subscribe and Twitter follower buttons. This plugin can be added at the top or bottom of the article so it catches your visitors at tension and encourage them to like, send and subscribe to you and follow with you. Definitely this widget boost your Facebook Likes, increase your Facebook subscribers and twitter followers. Let's follow the below tutorial step-by-step and add this amazing widget to your blog and start seeing some increase in your stats. Before going further steps please have a look at the demo of this widget below.

Do You Like This Story Widget Preview

Do You Like This Story Widget Demo

Live Demo

Add Do You Like This Story Widget to Blog

1. Go to your Blogger Dashboard click on ---> Design tab ---> Edit HTML tab.

2. Make sure to take backup of your Template before making any changes to your HTML. (More Info On: How To Backup Blogger Template.

3. Now click on Expand Template Widgets check box.

4. Search for below code in your Template. More Info On: "How To Find A Code In Blogger Template".

<data:post.body/>

5. Copy and Paste the following code just ABOVE it.

<b:if cond='data:blog.pageType == "item"'>
<div style=' height:110px;width:600px;  background:rgb(232, 240, 249); border: 1px solid rgb(171, 210, 233); padding: 10px; margin: 10px 0pt 10p 0px;'>
<p style='color:#dc0771; margin: 0pt 0pt 5px; font: bold 1.5em helvetica,arial,verdana;'>Do You Like This Story?</p>
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><div class="fb-like" data-href="http://facebook.com/ravisaive.in" data-send="true" data-width="450" data-show-faces="true"></div>
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&amp;appId=267875529909307";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-subscribe" data-href="https://www.facebook.com/ravisaive" data-show-faces="true" data-width="450"></div>
<a class='twitter-follow-button'  href='http://twitter.com/ravisaive' rel='nofollow'></a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script>
</div>
</b:if>

6. Please make following changes in the above code before saving.

1. Replace ravisaive.in with your Facebook fanpage username.
2. Replace ravisaive with your Facebook username.
3. Replace ravisaive with your Twitter username.

7. Finally, save your template and view any of your blog post.

Important : The widget is designed to display only on post pages, if you wish display in homepage too, then erase two red lines showing in the above code.

Add Do You Like This Story Widget to WordPress

WordPress users can simply add the provided code in #Step5 without the red lines just below their post titles.

This code is taken from MBT and modified little bit by adding Facebook Subscriber button to it. If you need help while adding to your blog feel free to post your questions using our comment section below.