How to Add Facebook Like Button Widget to Blogger (Official)

Do you want to add a simple and clean facebook like box widget to your blogger (blogspot) ? Well, I've got it for you in this post and its very clean and fast loading.

Facebook is one of top social media site to promote your online content. You can drive a huge amount of targeted traffic to your blog and websites by facebook pages and groups.

If you don't have a facebook page for your blog or website yet then go and create a one. For a good amount of targeted traffic your facebook fan page must be active and big. From big, I mean with a healthy number of likes.

To increase your facebook fan page likes, Its a good idea to add your facebook page to your blog. It will be cost-free and easy for your as well. So, inspite of creating ads and investing your precious money, its highly recommended mate.

In this post, I am going to share a very good looking facebook like box widget for your blog. It purely coded and won't affect your blog's loading time anyhow. Below is a simple screenshot of it.
Demo of Facebook Like Box Widget
So, without wasting your time I would now like to share the like box widget for blogger. Just follow the steps carefully and make it own.
Dont Miss: HOW TO ADD BREADCRUMBS NAVIGATION WIDGET TO BLOGGER

How to Add Facebook Page Like Widget to Blogger?

Log in to blogger and Select your blog.
Now, Go to Template > Html & anywhere inside the html box. After that, search for <body> tag and copy-paste the below given javascript code just below <body> tag there.

<div id='fb-root'/> 
<script> 
//<![CDATA[ 
(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/sdk.js#xfbml=1&version=v2.3"; 
  fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk')); 
//]]> 
</script>

After that, Go to Layout > Add a Gadget & Select Html & Javascript. Now, Copy-paste the below code there & hit the save button.

<div class="fb-page" data-href="https://www.facebook.com/Tricksfeed" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/Tricksfeed"><a href="https://www.facebook.com/Tricksfeed">TricksFeed</a></blockquote></div></div>
Replace Tricksfeed with your page Username

Thats all. Be the first one to view it.

Thats All. Your widget must be appearing there. You can re-arrange its position anytime by dragging under Layout area.

Just leave a comment if you are having any issues with this facebook like widget for bloger. Happy Blogging :)
Previous
Next Post »