By

Add a Facebook Like button to WordPress

Facebook has over 500 million users, with 50% of those users logging in on any given day. Wow.

If you don’t have a Facebook like button on your site, you should. A like button allows your content to show up in your customer’s feeds, the next best thing to actually “friending” them.

So how do you add a Facebook like button to your WordPress theme? Funny you should ask…

Thumbs UpThere’s a couple different things you need to know before we do this.

First, there’s more than one type of like button.

There’s a like button you can put on all of your pages and posts, and when a user clicks it, they are saying that they like only that page. This is not the same as going to your Facebook page and clicking “Like”, and they are not liking your entire website. They are saying I like the page “http://www.example.com/blog-post” for example.

Facebook Like Button Page Only

The easiest way to put this type of like button on your site is to use one of the many plugins that do the hard work for you. Here’s a couple of them:

(Tip: the easiest way to add plugins is to login to your admin area, go to Plugins => Add New)

The second type of like button is the kind that likes a specific url, like your homepage.

Facebook Like Button URL

Facebook has a super easy tool to make this button code for you here: http://developers.facebook.com/docs/reference/plugins/like/

Just copy and paste that code anywhere onto your site to add the like button. For example, you could drag a text widget into your primary sidebar, and paste the code there.

The third type of like button is actually called a “Like Box.”

This one is my favorite. The like box displays the like button for your actual Facebook page, not for a webpage. It also has options to display your Facebook feed and faces.

Facebook Like Box

Here’s what our like box looks like (I have disabled the feed, header, and faces):

If you click “Like” above you will see the button in action. (Don’t worry, you can always click “unlike” for anything you like.)

Again, Facebook has a great tool to create this code for you: http://developers.facebook.com/docs/reference/plugins/like-box/

Same deal here, you can paste that code anywhere you like on your site. There are also a variety of plugins you can use, here’s a couple (I have not tested these):

That’s it, have fun!

Your first practical exercise is to like Press Coders, by clicking like below…

9 Responses to Add a Facebook Like button to WordPress

  1. Marcelly says:

    Hey Scott! Thank so much for this post! It really helped me!

    Also I enjoyed myself reading this.

    Keep on doing this great job!

    Greetings from capital of Brazil. o/

    =)

  2. Thank you a lot.I used the widget box and within a few minutes I was done.Keep on writing good stuff.Cheers!

  3. Fatcat says:

    Hi there, I came across this to learn about placing the Facebook Like button. I have wordpress.com rather than .org, which can’t add plug-ins. Any suggestions of how I can solve this without going into coding? I don’t know anything about that unfortunately. Much appreciated. Thank you –

  4. Prashanth says:

    I was looking if there is a way I could add like and +1 buttons to each of the photographs in gallery?

  5. Peter M says:

    That’s a great article. I’d love to add a bar that has facebook, twitter, G+ etc….

  6. pierre says:

    can a Like button be added without a count beside it?

    thanks

  7. Eren says:

    I get code and add to text sidebar 2 but it’s showing on my blog. Also I want like button on under all my recipes. I have no idea how will i make it. Thanks