Setting Up Facebook Connect for Wordpress

Code, Internet — Tags: — adam @ 12:37 am

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.

223 Comments »

  1. Comment by Facebook User — May 5, 2009 @ 6:44 pm

    Great Post. Thanks.

  2. Comment by Martin Pedersen — May 14, 2009 @ 3:42 pm

    Thanks, it works great in IE – but it won’t post in Google Chrome and Firefox…

  3. Comment by adam — May 19, 2009 @ 6:23 pm

    try rolling back the changes to fbconnect.js

  4. Comment by Adam Hupp — May 21, 2009 @ 1:59 pm

    Hi Adam,
    Nice documentation. I’ll link to this from the wiki page. BTW, the bug in #7 is fixed now.

  5. Comment by Thomas Coburn — May 22, 2009 @ 2:12 am

    this is nice documentation yeah. I’m posting here to test this out to see what its like

  6. Comment by Thomas Coburn — May 23, 2009 @ 7:48 pm

    I think you missed a step here for us newbies. You need to post how to set up the facebook application, for us newbies. I keep getting “application under construction” when I click on the connect link in my blog. I followed every step to a “T”, and thats what it keeps telling me
    my blog is at tcoburn.com

  7. Comment by Adam Breckler — May 23, 2009 @ 9:14 pm

    Hi Thomas, I tried commenting on your blog and it seemed to work for me. Perhaps facebook was temporarily down when you tried it.

  8. Comment by Jose Enrique Gonzalez Modecir — May 24, 2009 @ 3:44 pm

    Looking forward to test this one

  9. Comment by Jon — May 25, 2009 @ 5:50 am

    i have succeed in posting comment in my blog using FB login username and password, but it doesn’t feed back to FB. what i have done wrong?

  10. Comment by Adam Breckler — May 25, 2009 @ 2:24 pm

    Hi Jon, try implementing Step 7 in your fbconnect.js,
    or if you tried that, try reversing it as the bug should be fixed.

  11. Comment by Fitho — May 26, 2009 @ 2:07 am

    Great post .. very helpful!
    Thanks a lot!

  12. Comment by George Dickson — May 27, 2009 @ 5:57 am

    hey adam,

    when is the 2.7 compatible version comin out!? i cant wait!

    great work!

  13. Comment by Eduardo Ruiz Bravo — May 30, 2009 @ 6:30 pm

    great explanation

    thanks

  14. Comment by Nikolay Ostrovskiy — June 1, 2009 @ 12:08 pm

    Everything is working expect it doesn’t show users avatars from facebook?
    Thanks

  15. Comment by Nikolay Ostrovskiy — June 1, 2009 @ 12:43 pm

    Never mind… its the theme I have..

  16. Comment by Adam Breckler — June 1, 2009 @ 6:09 pm

    George, what seems to be the trouble w/ your 2.7 implementation?

    This site runs on wp 2.7 and it seems to work fine.

  17. Comment by David Angel — June 3, 2009 @ 6:06 am

    Sweet. Any chance this plugin will ever have a widget with “latest users” type thing? That would be sweet!

  18. Comment by Facebook User — June 3, 2009 @ 12:43 pm

    I’m having a small problem here I think. It’s not logging the user’s name it just says, “Facebook User”. Is that an issue you’ve found?
    http://69.39.232.73/~f6ouwicp/wordpress/

  19. Comment by Vivek — June 3, 2009 @ 9:06 pm

    Hey,

    I followed the steps given above. I don’t see the “connect” button. Can you help?

  20. Comment by Adam Breckler — June 3, 2009 @ 9:14 pm

    @David Angel, I agree…that would be sweet, maybe someone knows about plans for that feature here http://forum.developers.facebook.com/viewforum.php?id=42

    @Facebook User, i’m not sure why this is…it could be due to your privacy settings on Facebook?

    @Vivek, perhaps it is because you are already “connected”. When I go to your blog (and I am not signed in with connect), I see the fb button below your comment form

  21. Comment by Facebook User — June 3, 2009 @ 11:38 pm

    That’s so strange because I just clicked on my name that was “facebook user” and it brought me to a screen on your wordpress like I was making a user on your blog. I wondered if I show up there now?
    I’m really baffled as to what’s happening

  22. Comment by Fredo — June 4, 2009 @ 2:38 pm

    Hi,
    look super good ! “c’est génial”
    it’s works but some fb code is displayed (in clear) around facebook profil picture !

    example :
    comment by Karl Wax

    you can check the problem here : http://www.subflow.net/wordpress/2009/05/netlabel-mix/
    any idea how to remove this ?
    Ton of thanks
    sorry for the approximative english

  23. Comment by Adam Breckler — June 4, 2009 @ 9:59 pm

    @Facebook User, this plugin creates a wordpress user for each new commentor on your blog, if for some reason your full name isn’t found then it will create an alias ‘Facebook User’

    @Fredo, check your includes for FeatureLoader.js.php and fbconnect.js, these are included in the body and footer of your page and should be in the header.

  24. Comment by Fredo — June 5, 2009 @ 12:28 am

    Thanks for your fast reply.
    It seem’s its a problem with my wordpress theme
    (because it’s work perfectly with default theme)
    :-/
    Merci Adam.

  25. Comment by Jonathan Thirkill — June 5, 2009 @ 4:09 pm

    Great work! I am having issues with my site http://Photography.thirkill.co.uk

    When a user comments using facebook no name is shown and the username is fb and then the users FB ID.

    Any ideas why the name isn’t brought across?

    Thanks,

    Jonathan

  26. Comment by Facebook User — June 7, 2009 @ 1:11 pm

    Nice work man… Reminds the rest of us coders why we got into this industry… the challenge!

  27. Comment by Facebook User — June 7, 2009 @ 8:50 pm

    Adam,

    you are the man for making such a nice tutorial of how to install Facebook connect. Come on by my FB profile and shout me out sometime. :-)

    Shawn

    http://www.ShawnDrewry.com

    http://www.ShawnDrewry.com/theceo.php

  28. Comment by Geoffrey Yhopix Rosete — June 7, 2009 @ 10:09 pm

    testing comment…. http://www.blogfornoob.com

  29. Comment by Nooruddien Muhammady — June 8, 2009 @ 11:52 am

    Hi Adam,
    Thanks for short and clear explanation
    great job ..

  30. Comment by Manish Khullar Nims — June 9, 2009 @ 3:12 am

    Hi I am using nextgen gallery plugin and it has a class photo that sets width 120px and height 130px for image. get_avatar function also has photo class and now my avatars are 120px by 130px :-(

  31. Comment by Adam Breckler — June 9, 2009 @ 7:03 am

    Hi Manish, try using < ?php echo get_avatar( $comment, 50 ); ?>, if that doesn’t do the trick you can try overriding your class with css and a body selector, (ie: body .photoclass img {width:50px;height:50px;})
    Hope this helps.

  32. Comment by Wihe Tecnologia — June 9, 2009 @ 8:59 pm

    nice plugin

  33. Comment by Manish Khullar Nims — June 10, 2009 @ 11:53 pm

    @Adam – It didn’t work.
    I had to delete nggallery.css from my theme folder to get it working. May be it helps someone.

  34. Comment by Ralf Rottmann — June 12, 2009 @ 2:47 am

    How can I programatically find out whether a user is logged in (via FBConnect) or not?
    I’d like to show some text only if the user is NOT YET logged in. I’ve tried

    if (!$user_ID) {

    }

    but that did not do the trick.

    Thanks!

  35. Comment by Facebook User — June 14, 2009 @ 9:03 pm

    Glad you have the same problem I have. In the official facebook demo ‘therunaround’ my name shows up correctly but with the unsupported WP-facebook connect, I get this ‘Facebook User’. Also works fine when commenting on readwriteweb.com

    Ideas?

  36. Comment by Facebook User — June 14, 2009 @ 9:13 pm

    The plug-in site says compatible up to 2.6 so 2.7 and 2.8 users are left in the dust. That’s probably where the “Facebook User” entries are coming from. Just google the term, it’s getting ridiculous.

  37. Comment by Jeremy Ampe — June 15, 2009 @ 8:09 pm

    I’m having the same “Facebook User” problem. I don’t think I can add this to my site until its resolved.

  38. Comment by Adam Breckler — June 15, 2009 @ 8:37 pm

    It seems to me like this has been happening more recently, but only with some users….i’m not sure what’s going on but my guess is that something has changed on the facebook end.

  39. Comment by Jeremy Ampe — June 15, 2009 @ 8:41 pm

    The Sociable plugin doesn’t seem to have this problem. I’m ging to try it now.
    http://www.sociable.es/facebook-connect/

  40. Comment by Jeremy Ampe — June 15, 2009 @ 9:09 pm

    It appears to be part of your Facebook settings. Go to this page
    hthttp://www.facebook.com/privacy/?view=search
    Then click to check the “Public Search Listing” check box on the bottom of the page. It can then take a while for your name to start to show up.

  41. Comment by Clint Seeley — June 19, 2009 @ 4:13 pm

    It looks like it’s working on my site, but no user pics are showing up

    http://www.scubadivingsarasota.info

  42. Comment by Clint Seeley — June 19, 2009 @ 4:23 pm

    never mind, I’m stupid…I got it fixed…lol

    Thanks for the good tutorial

  43. Comment by Facebook User — June 21, 2009 @ 4:37 am

    thanks for this tutorial

  44. Comment by Facebook User — June 21, 2009 @ 7:36 am

    nice plugin

  45. Comment by Billy — June 26, 2009 @ 12:10 am

    When someone logs in using their facebook account, the blank fields are still there (NAME, MAIL, WEBSITE). Is there a way to remove the option to fill out these fields once the user logs in with the facebook account?

  46. Comment by Eric — June 28, 2009 @ 7:27 am

    What file am I actually editing in the steps above? Thanks!

  47. Comment by Adam Breckler — June 28, 2009 @ 9:54 am

    @Billy,those fields should disappear once you log in, if they are still showing up, then you might want to try Step 6 as you might be having an issue w/ caching.

    @Eric, in Steps 1 & 2 you are editing your header.php, in the other steps I explain which specific file to edit.

  48. Comment by Eric — June 28, 2009 @ 1:54 pm

    Thanks; I got the proper files edited and am almost there.

    The only problem I am having now is that the name is showing as “FaceBook User”, although the pic comes up right. I see a few other people above had this problem too; anyone get it fixed? Thanks!

  49. Comment by Eric Adolph — June 28, 2009 @ 2:10 pm

    Test

  50. Comment by Eric Adolph — June 28, 2009 @ 2:37 pm

    Test2

  51. Comment by Eric Adolph — June 28, 2009 @ 2:38 pm

    Seems like I got most stuff working ok, The main thing not happening, is I am not getting the pop-up box asking me if I want to publish to FaceBook any ideas? Thanks.

  52. Comment by Adam Breckler — June 28, 2009 @ 3:21 pm

    @Eric, see comment #40 above.

    @Facebook User, Have you tried implementing step 7?

  53. Comment by Eric Adolph — June 28, 2009 @ 3:59 pm

    re: step 7

    __
    i don’t see that line of code anywhere is the file?

  54. Comment by Eric Adolph — June 28, 2009 @ 4:04 pm

    AH, sorry; I didn’t find it because I was searching for the full string … it didn’t come up becuase it’s already in the form that you said to change it to. Any other suggestions? TIA

  55. Comment by Selva Balaji — June 28, 2009 @ 11:57 pm

    hi can you ?

  56. Comment by Matt Herzberger — June 29, 2009 @ 10:46 am

    This is great!

  57. Comment by Matt Maher — June 30, 2009 @ 8:50 pm

    I’m also getting the “Facebook User” problem.

    When I’m signed in and I look at test comments I’ve made on my site, I see my name. Actually, I see it display “Facebook User” for a moment, then switch to my name. But when I look at it from another computer where I’m not logged into anything, it shows my avatar but I’m listed as “Facebook User.”

    Also, when a user is added through Connect, in Wordpress are they supposed to show up under users as “fbXXXXXXXX” for their name? All I am in my user list is “fb” followed by a bunch of numbers. That makes user administration a nightmare! I have no way of knowing who is who!

  58. Comment by Adam Breckler — June 30, 2009 @ 10:03 pm

    @Eric, sorry i’m not sure what else it could be, have you tried upgrading your wordpress?

    @Facebook User, the “Facebook User” issue is due to your privacy settings on Facebook. Try adjusting your settings per comment #40, http://www.facebook.com/privacy/?view=search

    The “fbXXXXXXX” you see created in your user table is the author created for your “Facebook User” comment. I know It’s kindof a pain, but this is the way the plugin keeps track of users/commentors. Hope this helps.

  59. Comment by Oleg Xtraboy — July 1, 2009 @ 4:34 am

    Hello,

    works well. But in IE and Opera the button FB Connect is not visible. I see only the text “Connect with your Facebook Account” :(

  60. Comment by Matt Maher — July 1, 2009 @ 1:17 pm

    @Adam: Ugh, that’s a bit of an issue. That makes the plugin far less useful, IMO. I’m creating a site that I expect a group of upwards of 200 specific Facebook users are going to visit. But even if they participate and comment on posts, all people are going to see is a bunch of people posting as “Facebook User.” It’s tough to inform all 200 people that they have to go to a specific page and click on a checkbox.

    Also, it would be helpful if the instructions for this plugin were clearer, or rather, more specific. For example, does anyone have a good suggestion of how to position the Connect button? Even in this blog, it’s a bit off, and I can’t seem to get it to display well at all.

    Lastly, is there a way to get that annoying box on the top-right to not show up at all? It’s really intrusive…

  61. Comment by Matt Maher — July 1, 2009 @ 1:58 pm

    Is there at least a way I can manually identify a user by that fbXXXXXX number, or vice-versa? I need to make some of the people who are logging in editors, and I currently have no way of knowing who I’m selecting.

  62. Comment by Adam Breckler — July 1, 2009 @ 8:26 pm

    Hi Matt. As I didn’t create the plugin, I’m afraid I can’t help much when it comes to the overall implementation.

    I would suggest that you have the authors’ comment on a post and then you can put two and two together to find who is who. Also you can ask them what their user id is when they log out of facebook on your blog.

    You can try using css to override and hide the .fbc_profile_header class that contains the “annoying” box at the top right.

  63. Comment by Guido Parlato — July 2, 2009 @ 6:32 am

    Just curious, i wanna try t do the same on my porfolio.

  64. Comment by Karthik Murugesan — July 2, 2009 @ 7:50 pm

    WOW. I love this plug-in.

    when I am logged into facebook i don’t see the button instead it logs the user in automaticaly. How do I prevent auto login?

  65. Comment by Kishor Bachhav — July 3, 2009 @ 5:20 am

    I like this plugin.

  66. Comment by Onur Dikyar — July 3, 2009 @ 5:28 am

    ???

  67. Comment by Vishal Mohla — July 3, 2009 @ 9:44 pm

    hi

  68. Comment by Rene Alvarez — July 3, 2009 @ 11:57 pm

    Great Post. Thanks!

  69. Comment by Facebook User — July 4, 2009 @ 2:16 am

    Thanks, worked for me :)

  70. Comment by Akansha Sharma — July 4, 2009 @ 5:55 am

    hi! this was very useful

  71. Comment by Dario Apicella — July 5, 2009 @ 11:36 am

    Lol! Just for test the connector!

  72. Comment by hneb — July 5, 2009 @ 10:59 pm

    Hello,

    plz help me for this configuartion:

    - my FB Application host on http://www.abc.de/blog/wp-content/plugins/wp-fbconnect

    - my artikel and comment is on the URL http://subdomain.domain.de/blog/a-artikel-here.html

    I can’t connect it. How should i config FB developers site (connect url, canvas url) and my cross-domain with xd_receiver.php?

    (sorry for englisch, but please help!)

    Thank you!

  73. Comment by Facebook User — July 6, 2009 @ 4:31 pm

    Generic avatar is showing for all commenters :(

    I am using the User Photo plugin. Is it incompatible??

  74. Comment by Adam Breckler — July 6, 2009 @ 9:19 pm

    It should be compatible, just make sure that you have replaced your avatar calling code in comments.php with

    < ?php echo get_avatar( $comment, 32 ); ?>
    
  75. Comment by Kishor Bachhav — July 7, 2009 @ 5:27 am

    just testing

  76. Comment by Facebook User — July 7, 2009 @ 12:23 pm

    testing

  77. Comment by Danila Daniloff — July 7, 2009 @ 1:30 pm

    do you know why all FB comments go to WB spam folder?

  78. Comment by adam — July 7, 2009 @ 9:03 pm

    Danila, not sure on that one…perhaps if you approve some of them then they will not get caught by akismet next time.

  79. Comment by Olivier Gérardin — July 8, 2009 @ 3:12 am

    Why no facebook picture and no facebook login display in the right top corner? I have the same problem and don’t manager to fix it. Anyone?

  80. Comment by Tylor j. Reimer — July 8, 2009 @ 6:58 pm

    This looks like a brilliant plugin. I will have to integrate it on my website.

  81. Comment by Diego Herrera — July 9, 2009 @ 10:48 pm

    great plugin

  82. Comment by Josh Kenzer — July 10, 2009 @ 7:56 am

    Awesome, I’m going to implement this on the Scottsdale blog today. Thanks.

  83. Comment by Brian Jambor — July 11, 2009 @ 6:51 pm

    Unfortunately, the plug-in doesn’t bring over the user photo from facebook. :(

  84. Comment by Brian Jambor — July 11, 2009 @ 6:52 pm

    I stand corrected. oops. SWEET!

  85. Comment by Facebook User — July 13, 2009 @ 7:08 am

    Just testing.

  86. Comment by Facebook User — July 13, 2009 @ 9:23 am

    This plugin is great. Does anyone have an add-on for new posts to be published to the registered facebook app’s newsfeed?

  87. Comment by emonweb — July 13, 2009 @ 12:41 pm

    can anybody tell why its not open up the facebook stylish inline popup window rather open up just another regular popup window?

  88. Comment by Facebook User — July 14, 2009 @ 12:33 am

    Great work!

  89. Comment by Facebook User — July 14, 2009 @ 6:23 am

    This is a pretty neat concept. Probably the best commenting integration system for WP that is simple to set up.

    Why is it some FB commenter’s name appear while others show as “Facebook User”?

  90. Comment by Facebook User — July 14, 2009 @ 7:04 am

    I do so that post #40 answers my above question.

    However, I do have another question. If you integrate WP and vBulletin, will Facebook Connect work well with both programs?

    Thanks

  91. Comment by Mark Hall — July 14, 2009 @ 3:12 pm

    Yep… just testing the Facebook Connect Plugin for Wordpress. Me like it.

  92. Comment by Mark Hall — July 14, 2009 @ 4:21 pm

    Adam – great job. Two quick questions.

    When I login to my blog at PrairieOakMedia.com it asks for app permission – yours doesn’t.

    Also, yours offers to share my post with my facebook wall, but mine does not.

    Something in my settings is different, but I’m not sure what it is?

    Any ideas?

    Thanks!

  93. Comment by Hoang Le Minh — July 14, 2009 @ 7:51 pm

    it works on some themes but not on Arclite theme. I heard somewhere that I need to append some code in custom theme to display icon facebook connect.
    Any helps?
    Thanks in advance!

  94. Comment by Trung Đức Lê — July 14, 2009 @ 9:10 pm

    Test

  95. Comment by Adam Breckler — July 14, 2009 @ 9:18 pm

    Mark, i’d poke around your app settings on facebook, maybe you will find something there.

    Hoang, try adding < ?php echo get_avatar( $comment, 32 ); ?> to your comments.php where you want your avatar to display.

  96. Comment by George M — July 15, 2009 @ 1:44 pm

    Hi. I’m reviewing the FAQ and it says:

    If you are a user of 1and1 hosting, follow these instructions: http://www.thecodecave.com/article206. The .htaccess file it describes must be placed in the root directory of your WordPress installation.

    Unfortunately the article no longer exists. Where can i find that information?

    Thanks!

  97. Comment by Ersin Han — July 20, 2009 @ 1:53 pm

    Thanks for this great plugin. You can see an example on my blog. http://www.catycat.net

  98. Comment by Tomas Grubliauskas — July 22, 2009 @ 7:13 am

    Where can I change appearance of “submit comment” button, because it doesn’t fit my theme.

  99. Comment by Ribhararnus Pracutian — July 25, 2009 @ 3:00 am

    Great tutorials

  100. Comment by Mamunur Rashid — July 25, 2009 @ 6:39 pm

    Great Plugin. But a little problem. I can’t logout. Even if I deactivate the plugin….

    Please tell me how to fix it.

  101. Comment by Facebook User — July 28, 2009 @ 7:17 am

    why is it that on other sites my name shows up but on sites that use this plug-in it shows up as Facebook User? I call BS on your privacy settings statement Adam, this can’t be it.

  102. Comment by Bana Na — July 29, 2009 @ 3:38 am

    i created mine and says it under construction and needs a connect url, can anyone help?

  103. Comment by Rien Swagerman — July 30, 2009 @ 1:15 am

    Nice!

  104. Comment by Tim Froling — July 30, 2009 @ 7:00 am

    Fantastic plugin. Logging out is a little erratic, but I still reckon it’s grouse!

  105. Comment by Zen Gabing — July 31, 2009 @ 9:24 am

    Hi adam, this plugin does not work with MCE Comments (http://mk.netgenes.org/my-plugins/mcecomments/). The WP is returning (empty comment).

    Any hacks to make them work together? Thanks

  106. Comment by Adam Breckler — July 31, 2009 @ 9:34 am

    @Zen, I’m afraid not easily…the plugin is made to work with the default WP commenting system.

    @Banana, Have you set up your connect application through the Facebook Developer App?

  107. Comment by Liam — August 1, 2009 @ 4:47 am

    I keep getting this even though Im sure Ive done everything above:

    supplied template data does not cover the following tokens [blog-name, post-title] needed for template ‘{*actor*} commented on the {*blog-name*} blog post “{*post-title*}”.’
    The application you are using returned an invalid response

  108. Comment by Matt Stratton — August 4, 2009 @ 7:08 am

    Finally got this working fairly well. One thing that does NOT work very well are the AJAX style inline comments that the Carrington theme uses on the main page template. For example, if you look at http://mattstratton.com, and click on “Comments” for any of the posts…you’ll see that the FB Connect button does not show up, and all Facebook commentors have the default Facebook avatar.

    But if you go to a specific post page, the button shows, and FB commentors actually show their avatar.

    I’ve also had reports where people claim that it “doesn’t work”, but it does post as their Facebook user. I think for some reason the page is not refreshing, so they don’t know they got logged in properly.

  109. Comment by James Bull — August 5, 2009 @ 10:23 am

    I seem to be having issues with Facebook connect. I’m pulling people’s avatar’s and they are being displayed and comments are being displayed properly.

    The problem is that the comment never actually gets fed to Facebook. The pop-up about publishing the story to the users news feed never comes up.

    http://www.jamesbull.ca/projects/snow/feature/monday-mix-8-tracks-with-jesse-burtner/

    Any thoughts?

  110. Comment by James Bull — August 6, 2009 @ 9:58 am

    Just 2 quick questions.

    Where do you place the supercache function? in your comments.php? or in the wp-cache.php?

    Is the get_avatar call still valid with WP 2.8? I’m using:

    and it doesn’t seem to work at all on the facebook avatars.

    http://www.jamesbull.ca/projects/snow/feature/monday-mix-8-tracks-with-jesse-burtner

    Thanks for the great tutorial! Helped me out huge!

  111. [...] plugin, installed & activated it in the wp-admin. After reading myself trough the Wiki and Adam Breckler’s tutorial I was ready to set up the required Facebook [...]

  112. Comment by Adam Breckler — August 9, 2009 @ 9:27 am

    @Liam, are you sure you have configured your application on facebook properly? Those feed templates should be supplied by the plugin for you.

    @Matt, I suspect you just need to call the avatar hook ‘get_avatar($comment,32);’ in order to have your comment author’s picture show up in the loop.

    @James, did you try tweaking line 93 of your fbconnect.js per Step 7? You would place your supercache function in your functions.php.

  113. Comment by Facebook User — August 9, 2009 @ 4:31 pm

    I can’t get the connect to the comments. What step am I missing?

  114. Comment by Liam Byrnes — August 10, 2009 @ 1:58 am

    @ Adam, I tried to set up the application and it shows up on facebook with an icon and Ive filled in all the sections, does the error point to anything in particular I may have missed? Your second sentence confused me a little, is it a plugin or facebook app problem do you think? Very grateful for any help you can offer, Thanks again. Liam

  115. Comment by Adam Breckler — August 10, 2009 @ 9:07 am

    @Liam, your error points to a problem with your “feed stories”…you should leave these blank in your application setup on facebook…the stories are supplied for you in your plugin’s config.php file.

  116. Comment by Liam Byrnes — August 11, 2009 @ 6:35 am

    @Adam Ive checked around the setting and there doesn’t seem to be any box mentioning feed stories, if there had been on set up I probably would have left if blank, Do you have any other ideas as to what might be causing the problem, Thanks Liam

  117. Comment by Pepe Rivera — August 11, 2009 @ 7:31 pm

    Interesting… must check it out later.

  118. Comment by Adam Breckler — August 11, 2009 @ 8:10 pm

    @Liam, for some reason the name of your blog and post title are not getting passed to your config.php….perhaps you are using an older version of wordpress that doesn’t support the plugin? I’m afraid I can’t guess what else it would be.

  119. Comment by Facebook User — August 12, 2009 @ 10:23 am

    @adam… I have made the fbconnect work just fine, but it’s not connected to comments in the blog. What did I miss?

  120. Comment by Adam Breckler — August 12, 2009 @ 6:05 pm

    Can you be more specific? Did you follow Step 5?

  121. Comment by Siy Bawel Amin — August 13, 2009 @ 11:35 am

    coolll

  122. Comment by Pablo Macaluso — August 16, 2009 @ 11:17 am

    Amazing!

  123. Comment by Hendrik — August 18, 2009 @ 11:49 am

    Trying this on my own site, but when I click on the connect button I always get a new window.. why doesn’t it show the nice “chromeless” popup like it does here?

  124. Comment by Facebook User — August 18, 2009 @ 3:21 pm

    Just a Test!

  125. Comment by Jonathan Thirkill — August 21, 2009 @ 2:22 pm

    When someone leaves a comment on my blog using facebook it doesn’t ask them to post it to there wall. Any ideas on how to get this to work?

    Thanks, Jonathan.

  126. Comment by Leandro Garcia — August 24, 2009 @ 11:36 am

    Very Good Plugin

  127. Comment by Eddie — August 27, 2009 @ 5:35 am

    this is still not working on my blog, however, i have google friend connect installed, could that be the problem?? do you think i should uninstall it to be able to use Facebook connect?

  128. Comment by Sebastian Öblom — August 28, 2009 @ 12:44 am

    Considering using this.

  129. Comment by Sebastian Öblom — August 28, 2009 @ 12:50 am

    this is great

  130. Comment by Facebook User — August 31, 2009 @ 4:35 am

    Nice plugin. installing it now

  131. Comment by Nathan Ryan Garza — September 4, 2009 @ 12:37 pm

    Testing FB Connect’s Comments

  132. Comment by Jean Dupont — September 6, 2009 @ 12:07 am

    testig this functionnality

  133. Comment by Flik Teoh — September 6, 2009 @ 5:42 am

    Hi Adam,
    I’ve added the plugin on my blog at http://www.flikteoh.com/
    However, after my user clicked the “Connect” button, the Connect Box refreshes itself to display my blog before it disappears.

    It was suppose to refresh the entire page instead of the Connect Box to get the Comment Form updated. Seen Billy #45 asked about this but there were no answers after reading through all the comments. Any clue?

  134. Comment by Flik Teoh — September 6, 2009 @ 5:52 am

    hmmm I guess it’s now fixed. I previously have Fan box added on the sidebar by using the given fanbox code.

    After installing this plugin, it calls the FeatureLoader.js.php another time thus caused the problem. It’s all fine now after removing the call from sidebar.

    Thanks and just incase Billy on comment#45 still haven’t has it solved, here’s the solution. Regards!

  135. Comment by Boris Dedoff — September 6, 2009 @ 5:15 pm

    Great plugin, love it.

  136. Comment by Mugs Mugunthan — September 8, 2009 @ 2:26 am

    this is an awesome application

  137. Comment by Vivo — September 8, 2009 @ 8:41 pm

    Awesome application. I didn’t manage to change the “f Connect” image though. I changed the image on my facebook application settings but it didn’t work. I suspect this is not a problem related to this plugin but then I don’t know how to change the image!

  138. Comment by Lalit Goklani — September 10, 2009 @ 11:39 am

    Nice post. Saved lot of time in figuring out things

  139. Comment by Chris Vary — September 10, 2009 @ 7:19 pm

    Thanks for sharing.

  140. Comment by Openhippo Web — September 12, 2009 @ 4:39 am

    nice work

  141. Comment by Kim — September 13, 2009 @ 7:53 am

    Hi Adam, thank you for the post. I was stuck and this helped me out. Quick question. If I want by default facebook users to be contributors and be able to post articles, how do I do that?

    Thanks,
    Kim

  142. Comment by Adam Breckler — September 13, 2009 @ 8:10 am

    Kim, you will need to change the role of the facebook users who sign in to your site to an author instead of a subscriber. I’m not sure where in the plugin you can change this but it will require some rewriting of the plugin code.

  143. Comment by Kim — September 13, 2009 @ 5:06 pm

    Thanks Adam. I’ll start looking over the code, if I find anything I’ll send it to you. Might be a good addition for the next version.

    -Kim

  144. Comment by Matto Xa — September 17, 2009 @ 5:00 am

    thanks for the triks!!

  145. Comment by Josh — September 18, 2009 @ 11:12 am

    Adam, great tutorial. Although it was working previously, I am currently having a problem in which the user is not being created in the database after logging in via Connect. Has anyone seen the problem before??

  146. Comment by Josh — September 18, 2009 @ 11:40 am

    Please disregard my earlier comment, the user I was testing with already existed in the usermeta table, but the users table…that’s what I get for messing around.

  147. [...] http://www.adambreckler.com/setting-up-facebook-connect-for-wordpress Please share this with others !! [...]

  148. Comment by Matt Shaw — September 29, 2009 @ 12:59 pm

    All of my comment avatars appear as generic images. Any help?

  149. Comment by Adam Breckler — September 29, 2009 @ 1:03 pm

    This is because those users have their privacy settings set on facebook to not allow their picture to be show. In my experience these users make up for about 1/2 of all users.

  150. Comment by Luke Moore — September 30, 2009 @ 5:47 pm

    testing 1 2 3

  151. Comment by Guido Nardo — October 1, 2009 @ 5:42 am

    nice

  152. [...] pictures. However, it has not been updated since the beginning of the year. Still, there is a nice tutorial by the developer Adam [...]

  153. Comment by Facebook User — October 5, 2009 @ 4:21 pm

    hey there, the only problem I am having is that instead of outputting a username, it shows this.

    Bradley Bmw Wint
    Facebook User

    XXXXX being the user profile id. The avatar seems to show up fine, so I am not sure what I am doing wrong or if there is a problem in the script or what. I don’t think it is an issue with my profile since I am searchable… any clues? Thanks

  154. Comment by Facebook User — October 5, 2009 @ 4:23 pm

    Ok seems, I can’t post the code, so check out my issue in this comment. http://www.carthusiast.com/bugatti-galibier-unveiled-picsvideo-2286.html#comment-224

  155. Pingback by HOW TO: Integrate Facebook With Your Blog — October 6, 2009 @ 7:19 am

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

  156. Comment by Frode Jørum — October 6, 2009 @ 8:20 am

    The plugin itself works well, but I get this line visible on the very top of my blog:

    dir=”ltr” lang=”nb-NO” xmlns:fb=”http://www.facebook.com/2008/fbml”>

    Can’t see that I placed something wrong in the header, either…?

  157. Comment by Adam Breckler — October 6, 2009 @ 9:07 am

    Frode, it looks like you’re header code is miss-typed. Try copying the code straight from Step 1 into your header.

    Facebook User, see my comment #149, the settings to allow your name are in your Facebook Privacy >> Applications area on Facebook.

  158. Comment by Kenny Saunders — October 6, 2009 @ 10:56 am

    Great plugin, thx

  159. Comment by Vahag Dudukgian — October 7, 2009 @ 1:09 am

    This comment is just an excuse to test the plugin…thanks for the tutorial!

  160. Comment by Frode Jørum — October 7, 2009 @ 3:50 am

    Yes, it was…! One goes blind sometimes. Thanks, Adam. :)

  161. Comment by David Knight — October 7, 2009 @ 2:43 pm

    Awesome stuff thanks for the tutorial. I am having a slight problem logging out – anyone found a solution this one?

    Cheers, David

  162. Comment by Tony Faria — October 7, 2009 @ 10:08 pm

    Hi there Adam, I have this set up an working great, but do you know how I can use a specific Template bundle ID rather than use the feed form that gets generated from the config.php?

    I already have a template bundle ID that I’d like to use – alternatively any idea how to edit the old style config.php to include an image and active link as is created in the new Templates bundle console?

    If you could mail any ideas to ifanbespoke@gmail.com greatly appreciated, ben trying for hours with no joy :(

    Regards Tony

  163. Comment by Arifudin Dot Net — October 10, 2009 @ 8:30 pm

    wow…….. cool………. ;)

  164. Comment by Vahag Dudukgian — October 11, 2009 @ 3:14 pm

    Is there any way to show the avatar pics of the users who’ve left comments without requiring the user to log in? Right now, before a user logs is, it just shows up as an anonymous poster with the little facebook logo superimposed. Any help is much appreciated!

  165. Comment by Adam Breckler — October 11, 2009 @ 3:37 pm

    Tony, you can try editing your feed templates in your facebook app settings on facebook.com

    Vahag, probably none of your commentors have their privacy settings enabled to show their profile pic (see comments above as well as some pics on this comment stream that are anonymous).

  166. Comment by Steve Fronek — October 14, 2009 @ 10:32 am

    Thanks for the info Adam. I was wondering how you keep the Facebook users from your wp-admin section? I see yours is set up to say “no access for facebook users”. I tried what it said here: http://www.flowdrops.com/blog/wordpress/adding-facebook-connect-to-your-wordpress-blog/
    but that caused my entire blog to go white and not work. Is there another method you could explain.. in detail please :-)

  167. Comment by Peter G — October 17, 2009 @ 11:29 am

    Plugin works great, except that there seems to be no way for a Facebook user to log out of my blog without logging out of Facebook as well, as the Log out link above the WordPress Comment Box strangely does NOT work for Facebook users (this link only works when I’m logged in as the Administrator; if a Facebook user clicks it, the page refreshes, but they’re still logged in as before), so the only places for a Facebook user to log out are from the log-in state box or the Log Out link in the top right corner of the WordPress admin page.

    Question: How do I get the Log Out link above the WordPress Comment box to work for Facebook users? Is this a known bug or simply a glitch unique to my own blog?

  168. Comment by Adam Breckler — October 18, 2009 @ 2:30 pm

    Steve, you need to place that code in your theme’s functions.php file.

    Peter, logging out of connect will log you out of facebook by default (this is the way connect works and you can’t change this)

    The glitch with the logout button near the comment form is a known bug, I will let you know if/when I can find a fix for it.

  169. Comment by Richard Moore Infofeeder — October 18, 2009 @ 5:15 pm

    Hi Adam, a couple of questions, would be great for any ideas.

    I use a custom theme, and i did get your plug in to work, to a point, how do i get some sort of rss feed on the comments people make, i know it probably shows up on my facebook notifications feed, although i have trouble exporting that.

    I have a comment box for well over 200 pages, all different groups that are added from facebook, and people can comment and their comments do feed onto their wall, how can i get the comments people make from the whole of my site post onto my application that was made to generate the api key?

    I got this far but i know that there is a lot more i could implement if only i knew how :(

    Maybe if you get the time, check out my site and profile on facebook to see if you can help with anything, it would be greatly appreciated.

    http://infofeeder.info/
    http://www.facebook.com/InfoFeeder

  170. Comment by Peter G — October 20, 2009 @ 7:07 pm

    My last post doesn’t display above, so I don’t know if you got it. Anyhow, I fixed the bug, and now the log out button above the comment box works for everybody, including Facebook users. I did so by removing

    get_permalink ()

    from

    <a href="” title=”Log out of this account”>Log out »

    in comments.php.

    Perhaps get_permalink () has an important purpose, and removing it may not be a good idea. Please let me know if there’s a problem with this fix.

  171. Comment by Peter G — October 20, 2009 @ 7:10 pm

    PS: I actually posted the entire piece of code, but since your blog is WordPress as well, your blog translated the code and only printed “Log out of this account”. I guess you know what piece of code I mean.

  172. Comment by Stras Webzine Infos — October 23, 2009 @ 5:59 am

    test

  173. Comment by 廖冠霖 — October 24, 2009 @ 8:15 am

    nice article

  174. Comment by Peter Gugerell — October 26, 2009 @ 1:20 am

    Plugin works great. Still, two issues that I’m having trouble with:

    (1) Upon login with one’s Facebook account, the page does NOT refresh automatically. So until the person manually reloads, he doesn’t really know that he’s actually logged in.

    (2) If you log in from the WP login page and then reload the page (because for some reason it doesn’t automatically do that), it stays on the login page and tells you you’re logged you, although you’re actually logged it. My guess is that, instead, it should reload automatically and take you to the blog home page.

    (3) Upon posting a comment while logged in with one’s Facebook account, nothing happens except that the comment shows up on my blog. Nothing appears on the commentator’s FB Wall/Newsfeed, and no prompt pops up asking whether he would like to post the comment to his FB page as well. (I’ve logged into your blog using my Facebook account, and I’ll know upon hitting “Submit Query” if your blog behaves differently in this respect.)

    I’d be grateful for any suggestions you may have. Thanks :)

  175. Comment by Amit Pandey — October 28, 2009 @ 3:05 am

    aa

  176. Comment by Facebook User — October 28, 2009 @ 7:07 pm

    How do I get the author/email/website to be hidden if they are logged in with facebook? It’s still showing for me.

  177. Comment by Carlo Francisco — October 30, 2009 @ 5:51 am

    nc this is working!

  178. Comment by Simon Ho — October 30, 2009 @ 8:57 am

    Great post

  179. Comment by Luca Mastroianni — November 1, 2009 @ 3:38 pm

    prova

  180. Comment by Adam Nojszewski — November 2, 2009 @ 4:37 pm

    My small solution to common problem, also found on this site:
    I had a problem with my name and av when I was logged in throught FC – the were not displaying (just “Welcome, Logout of Facebook” and default av displayed).

    http://wordpress.org/support/topic/327571?replies=1

  181. Comment by Anta Ragnarok Onlone — November 12, 2009 @ 8:50 am

    Gracias lo acabo de instalar esta genial :D

  182. Comment by jason cairns — November 12, 2009 @ 4:42 pm

    Hi, love this, BUT..HOW do I make it so the facebook profile doesn’t show on my HOMEPAGE and other pages that DON’T have a comment section. I only want the facebook connect to appear in the comment section.

    Any help would be appreciated. CHEERS!

  183. Comment by Adam Breckler — November 22, 2009 @ 11:57 am

    Hi Jason,

    You could try conditionally calling each part in Steps 1-4 with something like this

    if(!is_home()) display code here;

    This example would prevent connect from loading on your homepage.

  184. Comment by Gavin Taylor — November 23, 2009 @ 7:53 pm

    Just a test to see if my facebook pic stays on here after logged out as it doesn’t on my own site.

  185. Comment by Gavin Taylor — November 23, 2009 @ 8:41 pm

    I got it sorted. For anyone that isn’t having there profile pic showing up after they’ve logged out on there site make sure you click on privacy setting on facebook and then into applications then settings and make sure that applications can access you’re profile picture. I just did it and it works perfect now. Don’t need to worry if you’re profile is on public search or not.

  186. Comment by Hans Lüderhagen — November 24, 2009 @ 11:25 am

    Thanks!

  187. Comment by TJ — November 30, 2009 @ 2:21 pm

    I still can’t get this sucker to work properly. Why is this so difficult. Does it post to my facebook wall?

  188. Comment by Dustin DeKoekkoek — December 2, 2009 @ 2:00 pm

    test

  189. Comment by Alex Kirwan — December 2, 2009 @ 4:23 pm

    Thanks, good post

  190. Comment by Ed Wang — December 6, 2009 @ 9:12 am

    test

  191. Comment by Greg — December 9, 2009 @ 1:21 pm

    I had FB connector up and running great. It was set to publish to twitter and a FB page. I changed the page name since I got a username for it but now WP does not publish to the PB page, just Twitter.

    I recall setting the url for the FB page but after scouring the WP admin panels it is NOWHERE to be found. Why is this so hard to find?

    I can find no documentation about this anywhere.

    Help!

    and thnks

    greg

  192. Comment by Matias Welz — December 11, 2009 @ 12:20 pm

    test~

  193. Comment by Paul Badke — December 13, 2009 @ 9:21 am

    Any idea how you could could show either fbc_display_login_state(); on the page or the regular WordPress “Logged in as” line?

    So…

    If fbc_display_login_state()==true
    show fbc_display_login_state();
    else
    “Logged in as X. Logout >>”

  194. Comment by Paul Badke — December 13, 2009 @ 9:32 am

    Nevermind, here it is for anybody wondering:

    Logged in as . (<a href="” title=”Log out of this account”>Logout)

  195. Comment by Matias Welz — December 16, 2009 @ 5:32 am

    I keep getting Invalid API key specified with this plugin. I have it configured properly though. My setup works with wordbook.

  196. Comment by Alexander Gloning — December 18, 2009 @ 3:54 am

    Hi, can you tell me why my connect isnt working anymore. I dont find the bug…

    Always gives me an error when I want to connect:
    http://www.glamour.de/blog/wolfgang/new-moon-robert-pattinson-trailer/

    It worked already. I didnt change anything big. Is the problem on the facbook side?

    THX Alex

  197. Comment by Mossack Yevon Anme — December 19, 2009 @ 5:15 pm

    In my site (http://www.mossackanme.web.id/review/), the send-comment button-image can’t be loaded if a guest is login with Facebook through WP-FacebookConnect plugin.

    What should I do to solve this problem?

  198. Comment by Facebook User — December 21, 2009 @ 10:22 pm

    testing

  199. Comment by Adem Çırak — December 22, 2009 @ 10:26 am

    thanks.

  200. Comment by Facebook User — December 27, 2009 @ 4:29 am

    Its’ not as hard as it may at first appear. I’m having a successful integration of Facebook with my Wordpress Blog.

  201. Comment by Francisco Hernández-Marcos — January 5, 2010 @ 1:05 pm

    Thanks!

  202. Comment by Facebook User — January 5, 2010 @ 3:41 pm

    H’mm it wouldnt let me post – let me try this again

    Logged in as <a href="/wp-admin/profile.php > via Facebook.

    <!–XHTML: You can use these tags: –>

    <input type="hidden" name="comment_post_ID" value="" />

    ID); ?>

  203. Comment by Facebook User — January 5, 2010 @ 11:38 pm

    So I figured out whats wrong – but still don’t know how to fix it. Some reason Facebook connect is not registering an ID in wordpress. So the plugin is not forming a new ID when someone signs in via facebook and the value for the user id is showing up as zero. Please help me to fix this.

    Thanks.

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

  205. Comment by Aron Bardocz — January 10, 2010 @ 7:17 am

    Hi All,

    I allways get
    “Parse error: syntax error, unexpected T_OBJECT_OPERATOR in /USER/bardocz/bardocz_com/www/wp-content/plugins/wp-facebookconnect/fbconnect.php on line 37″

    when trying to activate the plugin.
    Tried WP 2.8.x and 2.9.1… no luck…

    Any idea?

    Thanks, Aron

  206. Comment by test — January 11, 2010 @ 10:45 pm

    testasfd

  207. Comment by Alex Poon — January 11, 2010 @ 10:49 pm

    Testing facebook connect

  208. Comment by test — January 11, 2010 @ 11:42 pm

    testing

  209. Comment by Facebook User — January 11, 2010 @ 11:44 pm

    testing facebook connect

  210. Comment by Peter Bickhofe — January 12, 2010 @ 8:09 am

    .

  211. [...] Setting Up Facebook Connect for Wordpress na stronie Adama Brecklera Podobał się artykuł? Dołącz do grona stałych czytelników bloga. [...]

  212. [...] pictures. However, it has not been updated since the beginning of the year. Still, there is a nice tutorial by the developer Adam [...]

  213. Pingback by Integrating Facebook In A WordPress Blog — January 19, 2010 @ 12:54 am

    [...] pictures. However, it has not been updated since the beginning of the year. Still, there is a nice tutorial by the developer Adam [...]

  214. Comment by WS Liang — January 24, 2010 @ 8:14 pm

    Hi Adam,

    I’ve a weird encounter with Facebook connect. The user profile picture is not showing on certain conditions.

    Profile picture is not showing when view with:-
    Windows XP IE7,8
    Win7 IE7,8

    But when view with Win 7 Firefox, profile picture is shown. For your site, regardless of what OS and browser I’m using, profile picture is shown. Any idea what went wrong? Thanks.

  215. Pingback by WordPress and Facebook Plugin « Sadhas Blog — January 27, 2010 @ 9:44 pm

    [...] Adam Breckler wrote up an installation tutorial: http://www.adambreckler.com/setting-up-facebook-connect-for-wordpress [...]

  216. Comment by Jason — January 29, 2010 @ 6:16 pm

    This is great, thanks

  217. Comment by as — February 1, 2010 @ 10:42 am

    dsdds

  218. Comment by Sok Heng — February 1, 2010 @ 10:31 pm

    thanks for the plugin

  219. Comment by Wcn Wicricnews — February 3, 2010 @ 10:55 pm

    test

  220. Comment by Mason Yarnell — February 6, 2010 @ 9:06 pm

    hey adam,
    thanks for the instructions. however, i can’t get the fb connect button to show up next to the comments, even though “Connect with your FB account” is visible. i made sure to be logged out of FB and out of the WP admin. the odd thing is that the FB button is actually showing up on the WP-admin login form. any ideas on this one?

  221. Comment by Adam Breckler — February 7, 2010 @ 9:51 am

    @mason , that is odd…do you have a live post that is supposed to have the connect button that I can check out?

  222. Comment by Mason Yarnell — February 7, 2010 @ 8:31 pm

    @adam, yeah, it’s a weird issue. http://www.amplifyprogress.com/wp-admin

  223. Comment by Adam Breckler — February 7, 2010 @ 8:51 pm

    @mason, are you sure you have you’re connect app set up on facebook and have configured the api key in the wp plugin correctly? Also, it appears as though the following files load in you’re footer instead of in the header where they should, fbconnect.css, FeatureLoader.js.php, fbconnect.js…view the source of this page for an example. Are you calling wp_head() and wp_footer() in you’re header and footer respectively?

RSS feed for comments on this post. TrackBack URI

Leave a comment