Facebook like box for Blogger

Facebook is the most important social plugin for any blog or website in both wordpress and blogger.Now it is more important as equal as writing post.In last we wrote how to create a facebook fan page and also shared a trick how to automatically update facebook status for every blog post.These are post continued to wrote this for new bloggers.

Now here we going to create a facebook like box and much more in future post about share and other widgets from facebook developers page.

How to Create a facebook Like Box

1. Login to your facebook account.

2.Before that you must have your blogs facebook fan page

3.Then you must have facebook app Id(You can use an existing app Id for that blog).

4.Then visit facebook developers page

5.Now in that page for

 Facebook Page URL:Your facebook page address

Your facebook page may be in two formats 

when have more that 30 likes it will look and if you had assigned a name for that page

www.facebook.com/pagename

or

If you don't have 30 like and it will look like

www.facebook.com/pages/xxxxxxxx/pagename

You can use both either one to get like below image

6.Set width as more than 292px and for using in sidebar of mostly have 300px which will optimize for

   5 image in a row.

7.Then set height as 285px for 2 row of images with fans names as in the above image.

8.If you don't want the live stream then uncheck the show stream check box.

9.After you configure it will looks like below.

10.Now we are showing it for light theme and you can choose the either light theme or dark theme   from drop down list box.

11.Then may saw a show header check box it is for showing that blue find us on facebook,we prefer to show header.

12.Then click get code button.

Facebook Like Box Code Implementation

Method 1: 

Note:

If you have more than one facebook app Id then check for app Id which is for exact blog or exact fan page.

Here in this HTML5 code you must want to implement it in two places one in template inside the first part of code.Then copy and paste the code were you want  to display.

Example:If you like to show that like box  in sidebar then open a HTML/JavaScrip form blogger layout option and paste the code and save the code.

Method 2:

Now when code is displayed above then click the iframe tab in that as single code implementation method.Now copy the code and paste it in a html/javascript widget and save.

Recommendation:-

As many bloggers want to customize the blogger facebook like box but we recommend to use as same provide by facebook because the facebook is #2 website in world and it looks original why do we change that confuse visitors either its ad or real facebook like box.