Adding a Facebook “Like” Button to your WordPress Website

Facebook has released their new “Like Button” (or “Recommend Button” if you prefer) that you can easily add your WordPress posts and pages. Once added, your visitors are able to “Like” your post or page which is then updated into their Recent Activity stream on Facebook – I’m not aware of any plugin’s that do this yet, however it’s a really simple procedure so long as you’re comfortable editing your WordPress theme.

Not sure what I’m talking about? This is it:

There are two methods you have of integrating it to your WordPress install. The first is by embedding the Like Button code via an iframe, and the second is via the XFBML tag and requires you to use the JavaScript SDK.

Both of these methods have advanced settings available via the Facebook “Like Button” wizard. Other options for styling, layout and display are also configurable via the wizard.

Like Button for WordPress code

You can copy and paste the following code into your single.php or page.php theme files. We’re using the_permalink() tag to get the correct URL so it must be placed with the WordPress loop too.

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo the_permalink() ?>&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:25px;"></iframe>

Something to keep in mind

Arnab Nandi has brought up an interesting point on how the new “Like Button” could take advantage of its users (See: Deceiving Users with the Facebook Like Button).

This is a great post and after reading it I think Facebook will have no choice but to modify the Like Button functionality/layout to give the user more information on exactly what they are liking. I particularly like Arnab’s suggestion of a hover effect that would display the details of the domains that will be liked if clicked.

Tags: , , ,


Author | Leon Poole

Leon Poole is owner and founder of the Brisbane Web Design company Creative World. He has a passion for designing websites, solving problems and improving the user experience. You can follow me on Twitter or Google+.

One Response to Adding a Facebook “Like” Button to your WordPress Website

  1. Here’s the WordPress plugin:
    http://wordpress.org/extend/plugins/like
    No coding necessary, you can customize the look and placement of the button in the settings interface

Leave a Reply...

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>