WordPress Facebook “Like” Button

Facebook like buttonSo there’s this guy that we work with from time to time; he’s one of those “uppity blogger” types. I think he does something with Search Engine Optimization too… but who knows what’s really behind that boss goatee. Apparently he “liked” Facebook’s popular … “Like” … system and wanted to grab that functionality for his own, somewhat questionable, devices. All kidding aside, the team and MIND was contacted to develop a WordPress Plugin that is THE “Like” button from facebook… now available on your blog – as of yesterdays announcement at the F8 conference from Facebook CEO Mark Zuckerberg. Using The Facebook Universal Like button a user can add the “Like” button to any post. When a visitor “Likes” your post it will show up on their Facebook page (after they login of course). You then get yet another non-substantial feather in your cap in the form of a thumbs up (+1)! WEEEEEEEE!!!


* Download the plugin (current version: 1.1).
* Unzip the compressed file to your wp-content/plugins folder.
* Browse to the Plugins page under wp-admin and activate the plugin.
* Setting the options: Browse to Settings->WP FB Like Button.
* Use your own CSS by referencing div ID “wp_fb_like_button” (note that this is only the container for the iframe)

Like, do you like it? We hope you do!

Thanks to Chicago SEO for helping us push the v1.0.2 release!

56 responses to “WordPress Facebook “Like” Button”

  1. Just put it up. I’m using Thesis and wanted to hook it under the post title, but it looks like even the can only appear in the main content div. Is that correct?

    Anyway, worked around it using css for now.

    Well done guys!

  2. Thanks, Phil! We just put out v1.1 which should handle your issue. You can use <?php insert_wp_fb_like(); ?> in your templates to show the button wherever you want. We also added the ability to enable/disable the plugin for pages.

  3. I like it! Thank you for your work. Its been installed on my blog at KansasRoots.com and works wonderfully. Quick question though, what are the relative advantages of the width and height settings? I’m using the default 450w X 100h setting, and unfortunately until I get some like mojo on a post it just appears as a awkard empty whitespace. It would be awesome if that height could be fluid and expand and contract as needed to show avatars.

    Can you tell me if a height of 100 would display 1 or 2 rows of avatars? If wanted only 1 row to display, what would be the optimal height setting?

    • Thanks Jake. It would require a bit of javascript to let the height be fluid as you’ve described, a quick google for “iframe height” will give you some leads. In this case, the height and width settings are simply applied to the iframe style. I haven’t seen any pages with enough “likes” to make it to 2 rows so I’m not sure how that would be handled yet. After taking a look at the height of the avatar and the button, 65px height seems to be a good start for a single line under the button.

  4. Thank you again for this Plugin. Is it possible for you to support the WordPress auto-update for Plugins. You are so fast to develop new versions. It isn’t easy to follow πŸ˜‰

    Thank You

    • Thomas, we’ve submitted this to the WordPress plugin directory already, it just hasn’t been approved yet. Once we are, you will be able to update automatically. Thanks for the support!

  5. Thanks for this. We added it to our site (www.convinceandconvert.com), but can’t figure out how to make it appear at the top of each post instead of at the bottom. I’ve seen it done (http://davefleet.com/) but can’t figure it out! Any help would be much appreciated πŸ™‚

    • Jess, after you install the plugin, you can configure the placement from Settings -> WP FB Like Button. Select one of the “top” options under button alignment to make it appear at the top of your posts. You can also use <?php insert_wp_fb_like(); ?> in your template.

  6. Thank you for your answer and support. Does your Plugin also support a count of people, which like the article??? I mean does it tell you per excample “3 people like this. ” If not please integrate this to your (my favorite) plugin. If you need: In my blog article is a link to interesting video tutorial

  7. Thanks for the info guys, this is a great new feature. Once I get my blog up and running I will be sure to download the ‘Like’ plugin. I am also going to spread the word about your blog on my Twitter page.

  8. Thanks for this super handy little gem of a plugin.

    I’m really looking forward to integrating it with my existing blogs and experimenting with it to see the results.

  9. I was that peoples profile pictures would show up if they lied it. I am not getting that. Did I set something wrong? Thanks for the plugin…..It’s nice to be liked!

    • Jeff, you must set the “display faces” setting to true in the plugin’s settings. Do that and the profile pictures will show up if any of your friends have liked the post.

  10. Hey,

    The faces, despite having true parameter in ‘show faces’ setting, appear only if I am logged into Facebook. If I am not, then the plugin shows only the count of people that liked the post. How can I make it to show faces of the people who pressed ‘like it’ button without having to log into facebook account?

    • ikea24.pl, unfortunately, it is a limitation put in place by facebook, so we can’t do anything about that.

      Jenny O, the plugin only references what facebook has for each post, based on the post’s URL. If you by chance changed your permalink settings, that would do it.

  11. Hi! I installed the plugin, and it worked fine at first – I registered 41 likes for one post, 27 for another, and so on. After about a week, they all just disappeared – reset to zero. So last week I installed the upgrade. I got 4 likes on one post, and so on. Today they have disappeared again! It’s too bad.

  12. Hi, I noticed that when I disabled “show on pages” the button stopped showing on archive posts as well (i.e., it didn’t show when I browsed by tags.) When I looked in the plug-in code, I saw this line:

    if ( !is_feed() && !is_archive() && !is_search() && !is_404() && !is_page() )

    I solved the problem by removing “&& !is_archive()” from the above line. The button now appears when I browse by tags as well, and is suppressed only on pages. Are there any implications to this fix that I’m not aware of?

    Btw, great plug-in. Nice and simple.

Leave a Reply

Your email address will not be published. Required fields are marked *