Setting Up Facebook Connect for WordPress

by adam on February 23, 2009

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.

351 comments

[...] show up (with a Facebook designation) on your site. Check out Adam Breckler’s excellent tutorial for more help with this [...]

by HOW TO: Integrate Facebook With Your Blog - RedHuck on October 25, 2013 at 3:37 am. #

Leave your comment

Required.

Required. Not published.

If you have one.