How to Add Facebook Like Box Widget to Blogger/WordPress

Facebook like box is specially designed only for Facebook Pages that helps you to promote the page and it also allows your blog visitors to subscribe to your blog updates via their Facebook accounts.

Facebook Like Box

When visitors like your page, they automatically receive updates about your blog on their Facebook account.

To get the Facebook Like Box widget, first create your Facebook page then follow below steps to add Facebook Like Box widget to Blogger/WordPress.

How to get Facebook Like Box to Blogger/WordPress?

Step-1:

Note down your Facebook Page URL by visiting your Facebook account.


http://facebook.com/itbloggertips

Step-2:

Now, visit to Facebook Developer website to create Facebook Like Box Widget.


https://developers.facebook.com/docs/plugins/like-box-for-pages/

Step-3:

Paste URL into the Facebook Page URL field and leave all the fields blank for default width, height & color scheme:

There are 4 more option available to choose.

1) Show Friends’ faces: This will show the face of people who liked your Facebook page.

2) Show Header: This will show you header of your Facebook page.

3) Show Posts: This will show posts of your blog.

4) Show Border: This will create a border around the widget.

Choose the options according to your need otherwise select the option as shown in following snapshot.

Facebook Like Box

Step-4:

Once you are satisfied with all the inputs of the Like Box, click on the “Get Code” button.

Step-5:

As you click on “Get Code” button, you will be given the two codes with title of HTML 5, XFBML and IFRAME option.

If you want to add it to Blogger then only iframe code is required.

Just copy the iframe code and place the code wherever you want the plugin to appear on your blogger page. (Refer directly to Step-8)

If you want to use same method for both Blogger and WordPress, follow below steps.

Step-6:

Copy both the code in Notepad.

Step-7:

Then go to your Blogger Dashboard http://www.blogger.com/home) > Template > Click on Edit HTML button. Now paste the first code below the <body> tag and click on Save Template button as shown in following snapshot.

Facebook Like Box

Step-8:

Select on Layout section > click on the Add a Gadget link as shown below.

Facebook Like Box

Step-9:

Now select HTML/JavaScript from the pop-up window and paste the second code into the empty HTML box. Click on Save button to add Facebook Like Box Widget to Blogger. Use the same steps for WordPress too.

Facebook Like Box

WordPress Demo:

 

Blogger Demo: http://itbloggertips.blogspot.in/

If you get any difficulty in implementing it to WordPress, write to us in comment section.

SiteGround Black Friday Sale Below Banner

Get Free Blogging Tips & Technology updates in your Email !!!

Subscribe via RSS feed

The following two tabs change content below.
Anil Kumar
IT Blogger Tips focus on Blogging Tips, SEO Tips, Social Media, SQL Tips, PL/SQL Tips, Oracle DBA, Linux/Unix, Latest Technology, How Tos and Technical Solutions. You can find us on Facebook | Twitter |
Find on Google+

  • Aqualikes

    thanks, Beautiful guideline..

Siteground SALE
70% OFF SiteGround WordPress Hosting – $2.95/month (Exclusive Offer !!!)