Add Facebook Like box with Cover Photo in Blogger

Add Facebook Like box with Cover Photo in Blogger - This post is about how to add facebook like in website or blogspot blog.  By using this facebook like box you can use facebook like box with cover photo. Facebook authority recently update their Graph API v2.3. In this update they add some feature in facebook like box plugin. One of them facebook cover photo.

By using this new update, you should easily embed and promote your facebook page in your blog or website. Visitors are can like and share your facebook page without leaving your blog or website. In this post i share how to add facebook like box with cover photo (you should also add without cover photo). I am just share this code. You just change it with your facebook page url.

If you searching facebook like popup for website then, try our new and latest another post: Flat Popup Facebook Like Box Widget for Blogger . This facebook popup like box will help you to add a flat and minimal design facebook popup like box in blogger. Facebook widget for blogger is most important for every blogger. If you have a facebook widget in your blogger, then you can get a huge number of fan page like and it the best way to take your visitors on your hand.

Our another post about how to add facebook comment box to blogger. If you wanna add latest version facebook comment box in blogger, then must see this posts. hope you will helped. I saw many popular blog use facebook like box in their blog on sidebar. I think sidebar is the best position to place facebook like box on blogger. If you put facebook like box on sidebar, then it will be staring and you may get huge amount facebook like for your fan page.

Now lets star the tutorial. Follow below steps

 <div id='fb-root'/>
<script type='text/javascript'>
//<![CDATA[
window.fbAsyncInit = function() {
FB.init({
appId : 'FB APP ID',
status : true, // check login status
cookie : true, // enable cookies 
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
//]]>
</script>

<div class="fb-page" data-href="https://www.facebook.com/msdesign.rtml" data-width="300" data-height="250" data-hide-cover="false" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/msdesign.rtml"><a href="https://www.facebook.com/msdesign.rtml">MS Design</a></blockquote></div></div>

If you want to change the default setting of above, then you should change the following settings below. (the URL of facebook page must change)