Add Facebook Like Box in Blogger

Having Facebook page for your Blogger blog or website is a way to engage with your readers and get new visitors to your blog. Using Facebook pages we can generate a good amount of traffic for our blogs. More likes you have on your Facebook page, more chances of traffic you will have. You can post your new articles on your Facebook page for quick sharing purposes. Beside that, having a Facebook Like Box on your Blog is a way to increase your Facebook audience and stay connected with your visitors. Visitor will visit your blog and like your Facebook Page. In this way you will not lose those unique visitors and have them again on your blog through Facebook Page. This tutorial is about adding Facebook Like Box in Blogger Blogs. Basically as a Widget on Side bar of blog. I assume that you already have a Blogger blog so I will start this tutorial from creating a Facebook Fan Page for your blog. You can check the Bloggerjin’s Lab as Demo of Facebook Like Box in Blogger.

Add Facebook Like Box in Blogger

1. Login to your Facebook account, and go to Create a New Page. Select third option “Brand and Product”. Select “Website” from the drop down menu of Categories. Enter your Blog name as the Facebook page name. Accept Facebook terms and click on “Get Started”. Your Page is now created and you can fill some necessary information as you wish. [If you already have a Page, then you can skip this step]

2. Stay logged in your Facebook Account and go to Facebook App Developers. Click on “Create a New App” on the top right side of page.

3. A popup window will appear. Enter “App Name” and “App Namespace” and click Continue, as shown in image below. Then you may be asked for entering Captcha for verification.

4. Your App is now developed, which is actually needed for using Facebook Like Box on your blog.

5. Now, its time to get the code for your Facebook Fan Page. For this, go to your Facebook page. From the top Admin Panel click Edit Page >> Update info >> Resources >> Use Social Plugins >> Like Box. Enter your Facebook Page URL and enter other information as you desire. Check the image below for my Like Box.

6. After you are happy from the view, Click on the button “Get Code”. A popup window will appear. Go the IFrame Tab. There you will see a script. This script is actually using the App ID of your App which you have recently developed. Screenshot is given below. Now copy [Ctrl+C] this code to your clipboard.

7. Login to Blogger Dashboard >> Layout >> Add a Gadget >> HTML/Javascript. Now paste that code into it and save it. That’s it.

Simple Method

If you can’t afford doing all that above stuff, so I think I can give you my own code for your usage. You just need to change the Username of your Facebook Page in the below code.

Find bloggerjin in the above code and simply replace it with your Facebook Page’s username. If you don’t have Username for your FB page, then you can also enter the ID of page. You can get ID of page from the URL when you edit your page info. Like Bloggerjin’s FB page ID is “410530739034949“.

Your Facebook Page’s Like box is now setup on your blog. You may need to make some modifications for width according to your template. Just edit the widths on the above code from 292px. This was all about Adding Facebook Like Box in blogger blogs as a Widget.Hope this Blogger tutorial will help you in learning some other basic points. Stay connected with Bloggerjin for latest Blogger Tutorials, Templates and widgets. Have a nice day!