Setting Up Facebook Connect for Wordpress

by adam

These steps are needed to prepare your wordpress blog for facebook connect integration using the WP-FBConnect Plugin. The plugin is documented here and you can download it here. The implementation is pretty simple, but there are some caveats as follows.

Step 1:

Add the language attributes wp function to your header(s). The plugin will add the following lanuage attribute for you “xmlns:fb=”http://www.facebook.com/2008/fbml”.

<html xmlns="http://www.w3.org/1999/xhtml"
<?php language_attributes(); ?>>

Step 2:

Call wp_head in your header(s)

<?php wp_head(); ?>

Step 3:

Call wp_footer in your footer.php

<?php wp_footer(); ?>

Step 4:

Call the login function from your comments.php. Use the ‘do_action’ hook so that if you disable the plugin, it is not called.

<?php do_action('fbc_display_login_button')  ?>

Step 5 (optional):

Call the following code in your comments.php if it doesn’t already exist. It will display the facebook commenter’s profile pic or an empty gravatar/avatar if left by a regular user, ‘32′ is the size of the avatar you would like to display.

<?php echo get_avatar( $comment, 32 ); ?>

Step 6 (optional):

Call this function if you are using WP-Supercache or another caching plugin. You need to make sure that the “YOURAPIKEY_user” cookie isn’t cached. Replace YOURAPIKEY with your unique developer api key.

<?php
function fbc_supercache($cachestr){

if(isset($_COOKIE["YOURAPIKEY_user"]) )
$cachestr .= $_COOKIE["YOURAPIKEY_user"];

return $cachestr;
}

add_cacheaction('wp_cache_get_cookies_values', 'fbc_supercache');
?>

Step 7 (optional):

Some versions of wordpress will need a bit of a hack to fbconnect.js. Change the following on line 93.

if (comment_text.trim().length === 0) {

to: 

if (comment_text.length === 0) {

Note:I am not the developer of this plugin. Full credit goes to Adam Hupp for creating it.