How To Add a Facebook Like/Fan box to Blogger

A Facebook Fan Box or Like Box is a great plugin that allows blog visitors to subscribe to your blog updates via their Facebook accounts, without leaving your blog. After subscribing (by pressing like button) , visitors will receive your most recent blog updates on their Facebook page. This box also displays faces of the "likers" on your blog. Before creating a fan box you should already have a facebook fan page.

Facebook Like/Fan box to Demo


Live Demo


How To Add Facebook Like/Fan box to Blogger

  • Go to Blogger Dashboard --> Layout --> Add A Gadget
  • Select HTML/Javascript and paste the code shown below in it

<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";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like-box" data-href="http://www.facebook.com/latesthacking" data-width="300" data-height="260" data-show-faces="true" data-stream="false" data-header="false"></div>


  • Replace http://www.facebook.com/latesthacking with your facebook fan page url
  • Change  data-width="300" data-height="260"  according to your template

Like it? Share it.

2 comments

Reply
Unknown
9 July 2012 at 00:21 Author

how to add it on top of post in home page..?

Reply
Unknown
9 July 2012 at 00:52 Author

@Mohit Gupta Search <data:post.body/> in your template and paste the code above it

Click to Add a New Comment

  • If you're asking a question click on Subscribe By Email link, on the comment form, to be notified of replies.
  • Do NOT add links to the body of your comment as they will not be published.
  • Only the comments posted in ENGLISH will be approved.
  • If you have a problem check first the comments , maybe you will find the solution there.

Subscribe to: Post Comments ( Atom )