This series is supported by Rackspace, the better way to do hosting. Learn more about Rackspace’s hosting solutions here.
Facebook officially unveiled its new Open Graph API and tools a few weeks ago, making it possible for developers and end users to easily hook their own sites into Facebook’s broader ecosystem.
In just the first week, Facebook’s social plugins were integrated into more than 50,000 websites. We expect that number will continue to increase at a rapid rate, especially as businesses and e-commerce sites figure out how to best harness the power of Open Graph.
Although Facebook has ample documentation to help you implement the “Like” buttons onto your own website or blog, it’s still easier on some platforms than it is on others. Posterous and Typepad users, for instance, have “Like” buttons as a built-in option. Today we’re going to look at some of the ways you can implement Facebook’s Like buttons and other social plugins into your hosted WordPress blog or website.
Option One: Edit Your Theme Files
As we will discuss later in the article, there are already dozens of Facebook Like plugins for WordPress available on the web and in the official WordPress.org Plugin Repository. These solutions are certainly the easiest way to add a “Like” button or other social plugins to your site, but they won’t necessarily give you the type of control you can get by just inserting a few lines of code into your theme files.
Why would you want to do this? Depending on your blog or website’s design, you may want buttons or other social information to be displayed in a particular way or in a particular area. While some of the plugins will let you create CSS classes that can then be edited in your theme, for some developers, it might just be easier to add a “Like” button directly to your theme files.
WPBeginner and Devlounge both have good tutorials about how and what code to insert in your theme, but the gist is:
Within your single.php file, in the post loop, add the following line wherever you want the button to appear:
You can adjust the parameters like show_face=true/false and colorscheme=dark/light depending on your preferences. Again, you can see the official Facebook documentation or the two tutorials above for more detailed information.
Option Two: Use a Plugin
This is the option that will be easiest for most users to implement. Right now, there are scads of Facebook “Like” button plugins and other social plugin tools available. It’s great to have options, but it can also make finding the best plugin for your site more difficult.
Here are a few we tried and liked (and to be clear, this is not intended to be an exhaustive or definitive list):
Like – This plugin supports multiple languages, gives a number of display options and can be shown at the top or bottom of a post, on pages and on the front page, all based on what settings you select.
Facebook Like Button – This plugin has a nice settings panel that makes it easy to see and adjust how you want buttons to appear.
Facebook Like Button Plugin – We like that this plugin supports a shortcode, which means that you can indicate what posts to include a button on or not, in the post itself. You can also set default global options.
One plugin that I really like is the Facebook Social Plugins by Olivier Lussier. It has the standard Facebook “Like” button options similar to the other plugins, but it also includes widgets that support other Facebook social plugins.
For instance, you can have a widget that is a “Like” button for any page showing that widget. This is a great option for people who don’t want to have buttons in the bottom or top of their posts but still want people to be able to “Like” an item.
You can also include a “Like Box” for a Facebook Page you have set up. So if you have a Facebook Page associated with your website or company, etc., you can include that box on your website.
Other widgets include an Activity Feed, a Facebook Comments box and a Recommendations listing. These options may need to be customized to fit your individual site or theme, but it makes integrating these social plugins pretty fast and painless.
How are you integrating Facebook into your WordPress blogs? Let us know!
For more technology coverage, follow Mashable Tech on Twitter or become a fan on Facebook
Series supported by Rackspace
Rackspace is the better way to do hosting. No more worrying about web hosting uptime. No more spending your time, energy and resources trying to stay on top of things like patching, updating, monitoring, backing up data and the like. Learn why.
Reviews: Facebook, Posterous, Twitter, TypePad, WordPress
Tags: facebook, Facebook Like, web development series, WordPress, wordpress plugins
