How to Add a Facebook Like Box Widget in WordPress

>How to Add a Facebook Like Box Widget in WordPress

This post was last updated on 13/9/2018

Adding a Facebook Like Box on your WordPress website, usually in your blog’s sidebar, could get you more Likes.

That’s because if a user enjoys your articles, it’s more likely that he/she will click the Like button on your sidebar, rather than searching for your Facebook social icon, going on Facebook, and giving you a Like there.

Users like things which don’t require too much time or hassle. We are in the age of speed after all, no?

In this guide, I’ll show you how to add a Facebook Like Box widget in WordPress, without using a plugin or going through your theme’s code.

Don’t worry, it’s way easier than it sounds!

Customizing the Facebook Like Box

The first thing you need to do is to go to Facebook’s Page Plugin and create/customize your Like Box. Here’s how it looks like:

Facebook Page plugin

  • In the Facebook Page URL, insert your own Page URL;
  • Add whatever tabs you want the plugin to “grab” from your page;
  • Choose the width and height depending on your layout;
  • Choose if you want to show the profile images of the recent people that liked your page;
  • Choose if you want a big header or a small one;
  • Choose if you want to hide the cover photo or not. A header container will still remain;
  • After you finished, click Get Code.

You’ll notice that every change you make will be previewed, which is awesome because you can see how your Facebook Like Box will look like before you add it on your site.

Adding the Facebook Like Box code in a WordPress widget

After you click the Get Code button, this will appear:

facebook page plugin code

As you can see, you can choose between JavaScript SDK and IFrame. Go with the JavaSCript SDK.

Notice that the JavaSCript SDK has two parts. You need to copy both of them, one after another. Here’s how:

Step 1

Copy the first part (JavaScript SDK). Just click somewhere in that grey box and the code will be automatically selected, so you can copy it quickly.

Step 2

Go to your Dashboard -> Appearance -> Widgets.

There, you need to drag a Custom HTML WordPress widget into your designated widget area (sidebar, footer or others).

drag custom html wordpress widget

Step 3

After you added the Custom HTML widget, write a title (e.g. Like Us!) and then paste the first part of the code.

Step 4

Go and copy the second part of the code and paste it under the first part.

facebook like box code in wordpress widget

Step 5

Save it and check out the brand new Facebook Like Box that you added on your WordPress blog or website!

Here’s a video guide as well (it’s a bit oudated):

You might want to learn:

Hope you found this post helpful! If so, don’t forget to share!

If you have any questions or feedback, please leave a comment.

By |2018-09-13T17:14:19+00:00December 19th, 2014|WordPress|0 Comments

Leave A Comment