How To Add Facebook Like Box to Blogger/blogspot Blog Using html5

The Like Box is a social plugin that enables Facebook Page owners to attract and gain Likes from their own website or blog. The Like Box enables users to:

  • See how many users already like this Page, and which of their friends like it too
  • Read recent posts from the Page
  • Like the Page with one click, without needing to visit the Page
You must have a Facebook Page for your blog or a personal Fan page before you can generate the Like Box. If you already have a Fan Page, just get the url of the Page handy. 

If you do not have a Facebook Page, you can set up one now for free at :  Just click on the “Create Page” button and follow the instructions. You can read my tutorial on How To Create a Facebook Page

You can get the URL of your Facebook Page by visiting the page on a computer and copying the URL from your browser’s address bar. It is easier when you get a short url for your Page, which you can claim at : but you must have at least 25 fans before you can get the username for your page. 

Now, lets get started.

1. Login to 

2. Go to

3. You will see a dynamic form to fill for you to generate the Like Box as seen in the picture below:

4. Paste or type the url of your fan page into the “Facebook Page url” box. You should notice a preview of the Like Box by the right hand side. 

5. Feel free to adjust the width and color scheme

6. If you untick “show stream” , your latest Page posts will not show above the Faces in the Like Box. 

7. Once you are satisfied , click the “Get Code” button. 

    You should see a pop-up window displaying two codes, with the implementation set as: html5

8. Login to your Blogger blog, go to Design/Layout, then “Page Elements“. Right on the sidebar or footer,      click on the “Add  Gadget” link. 

9. From the list of gadgets that will pop up, choose “HTML/JAVASCRIPT” gadget.

10. Paste the two codes of your Like Box into it and SAVE.

That’s all. 

View your blog and you should see the Like Box. If you are not okay with the width, you can edit it from the code copied into the “html/javascript” gadget.

If you have questions to ask or contributions to make, kindly make use of the comment form below.

In my future posts, I will be sharing more blogging tips and tricks Subscribe to my blog if you do not want to miss them.

See also :   Floating Facebook Like Button For Blogger Blogs


Please Share :

Written by Jide Ogunsanya

Pro Nigerian Blogger, Digital Marketer and Web designer. I help business owners to grow their businesses online. You can join my Facebook Group here.


Leave a Reply

Leave a Reply

We're glad you have chosen to leave a comment. Please keep in mind that comments are moderated according to our comment policy. Your email address is required but will not be published. No keyword stuffing in the name field and commenting from blah blah blah makes no sense. Thank You.

  • Millionaire Reveals How You Can Make Millions Doing What You LoveRead More
  • Free Ebook Explains How To Design WebsiteDownload Now
  • We can help you ship items from Amazon USA to NigeriaMore Info
  • Do you want to ask some questions?Click To Ask

New Facebook Comment form for Blogger/Blogspot Blogs( reply & notifications enabled)

How to add Blogger/Blogspot blog to Alexa