DISQUS

Mashable - The Social Media Guide: HOW TO: Add Facebook Connect to Your Blog in 8 Minutes

  • Andy · 1 year ago
    Pretty sweet, but a wordpress login would be a lot sweeter...
  • Andy · 1 year ago
    What I meant to say is a word press PLUG-IN would be a lot sweeter. I'm a big fan of 10 second set-ups. Stupid fingers...
  • Chris Messina · 1 year ago
    "Here's to keeping the web more open and more social". What a way to end it.

    Still, this makes it look mindnumbingly easy. Wow.
  • Mark "Rizzn" Hopkins · 1 year ago
    Yeah, I don't know. Compared to Google Friend Connect, this is ridiculously complex. Every time I keep considering switching my personal blog from Friend Connect to FB Connect, I look at a howto and determine that I just don't have the time to do it.

    As compared to Google Friend Connect, which literally took me all of five minutes.
  • Justin Razmus · 1 year ago
    That's great, thanks for the info. I have not added it at this moment, but give me a couple days! http://www.justinrazmus.com.
  • Eren Emre Kanal · 1 year ago
    I have a question. What about W3C validations with Facebook's codes?

    When the sites use these non-standard markup codes, some browser cannot understand these. And of course there will be an error message on validator like this:

    element "fb:login-button" undefined
  • James Andrews · 8 months ago
    That is why they mention putting the extra code in the XML header at the top, so that the W3C validators know about FBML and it validates it.
  • Keith Barrett · 6 months ago
    I see that everywhere, just add that to your XML header. Well it's in mine and I STILL get the XHTML validation failure on strict for the fb:login-button. I've also followed all the instructions on the wiki. Seriously, this should not even require special instructions to make go away. It's bad coding.
  • Hercules · 1 year ago
    I am planning to implement Google Connect on my blog, not Facebook only because it is complicated. Maybe we can do both...FB might be more benefical because of the news feed, though.

    Thanks for the info, great post!

    www.business2press.com
  • cbiggins · 1 year ago
    Very cool. Makes me want to make a wordpress plugin to do this. :)
    Oh, I note no 'connect' button here when posting my comment either... hmmmm ...
  • Josh McHugh · 1 year ago
    Great point.

    Question: anyone know of some sites that have implemented both FBconnect and GFC? If so, care to list a few? I'd love to see a side-by-side usage comparison. Hard as FBC is to implement relative to GFC, the Techcrunch implementation made FBC seem really attractive from a usage standpoint.
  • thepete · 1 year ago
    Haha, saw this post on my iPhone just after crawling into bed, but the iPhone wouldn't play the video. Luckily I had my old PowerBook on my nightstand. Of course, the video is choppy and unwatchable on my 2004-era PowerBook, so I tried finding Facebook Connect on Facebook itself, and couldn't. Hey guys, text is always a nice backup to reach the most users. Of course, Facebook could also be a bit less insanely cluttered with features, too, but hey, I'm just wishing upon a star, here. :)
  • GadgetMan · 1 year ago
    The video is way too fast, so if you want to try it out, follow the developer site for Facebook Connect at http://developers.facebook.com/connect.php. And I double that this will take 8 minutes. I agree, from the looks of it, Google Friend Connect is faster, I just followed their web site (http://www.google.com/friendconenct, and I just copied their code and placed in my Blogger template and it worked.

    That's the thing with Google, the code is easy to use and implement! No wonder so many people love Google!
  • Greg Huntoon · 1 year ago
    I'm still debating this one. Been watching the issue for a long time, and still a little hesitant. But, in the end, I think I'll probably go through with it sooner than later.
  • reza · 1 year ago
    please help me add fb to my wordpress
  • Dave Morin · 1 year ago
    Thanks for the post Pete! When are we going to see Facebook Connect come to Mashable? :)
  • Javier Reyes · 1 year ago
    For Wordpress bloggers there is a Facebook Connect plugin from sociable/sixjumps:
    http://www.sociable.es/facebook-connect

    Easy to install and configure.... 2 minutes ;-)
  • Christopher · 1 year ago
    I tried your plugin and it just didn't seem complete. Ping me if you think I'm missing something, but the results seemed less than if I rolled my own using this video.
  • Javier Reyes · 1 year ago
    Hi Christopher,
    some wordpress themes need "a patch" to show login button and photos (on IE), please add this to your "header.php" theme file:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">

    ......
  • Kevin Lancashire · 1 year ago
    Using WP: Theme editor --- Comments.php
    First give the spanish guys a try - sociable FB-plugin for wordpress.

    Installed a very basic twitter plugin (twitter tools) for WP showing my posts. Is there a more elaborate plugin connecting twitter with FB? Showing posts of specific groups and enabling my readers to post tweets?
  • Mike English · 1 year ago
    Javier's Wordpress plugin is good. I just installed it on my blog with a few tweaks to make it work better with my theme.

    I think Facebook Connect is much better than Friend Connect for a blog because you can actually integrate it. Friend Connect's use of the open stack is nice, but it's isolated in a way; it lives in it's own little world not really interacting with your site at all. I'd rather use the DiSo project's plugins to add open stack features to Wordpress.
  • Osvaldo · 1 year ago
    Google, Facebook... what will come next ?

    I'm seeing in a near future (six months?) toons of external login methods. So you will have a login for Facebook a Google Friend Connect, but you will also need your own login and hum... maybe and Microsoft Connect ?

    And then we will have apps to connect like "Connect to Any" ("Just like Add to Any"), listing tons of open-login sites.

    I'm very frustrated that we don't have a signle standart for this. Have you imagine what the Internet would be like without STANDARTS ? A Internet with different e-mail protocols for every ISP, different FTP, SSH, specific browsers for specific pages...

    It's a pity that OpenID failed to convince the public (and major publishers) into adopt it. Open ID should be the only login you use. Then the apps could go to Facebook and other social networks to pick up info, but we would have a open protocol.

    Cheers.

    Osvaldo
  • Osvaldo · 1 year ago
    Hi Elliott. In my opinion big names don't want a standard. That's the problem.

    Standards are good. Look at the example of the CD. Every computer can read and write a CD (ISO 9660). Every Player can listen to music in the same CD's

    Now look at the mess you have with Blue Ray and HD DVD. Two systems because the industry wanted to force their own standard.

    Look at the mess with the cards for the photo cameras (XD, SD, Compact Flash, Memory Stick...) Every time you change the brand of your digital camera you may have to buy new cards. Now look how the GSM standart made things simple with cell phones. Your number is a GSM card, it doesn't matter if you use Nokia, Sony, Samsung, Alcatel...

    Can you explain me (and everyone watching this thread) how a market fight in the next years for a dominant login system is going to help the users ? It may be a never-ending fight...

    Cheers
  • Patrickometry · 1 year ago
    This is quite the dilemna. I have Google Friend Connect on my blog and Intense Debate commenting. Now I find myself excited to add Facebook Connect. The dilemna is that I hate cluttering up my blog with all of this. Ideallly, I would like to keep only INtense Debate and have it give Google and Facebook as one of its options for signing in. :( This will not happens for some time I fear.
  • Martha · 1 year ago
    looks good, you make it look easy, but
    if you're on a wordpress blog - where do you enter all that code????
  • Bill Callahan · 1 year ago
    For me, deciding between Facebook and Google has more to do with my users' experience than with how easy it is for me to program it. Facebook provides real integration with the whole Facebook platform. Google is, as Mike put it, "in its own little world."

    There actually is an open system for single login. It's called OpenID. (See http://openid.net/ ). The problem is that there is no agreed upon ID authority that everyone register with. So each web site sets itself up as its own main login site, defeating the purpose. Facebook, Google and Microsoft take this fragmentation one step further by providing a proprietary API for their single login solution. (For Microsoft, it was call "passport." I'm pretty sure it's more or less dead now.)

    I don't know how to solve this problem. I think the only possible way would be for the open source people to really champion OpenID, and by force of market, the big boys like Facebook and Google would allow OpenID as an alternate solution. But as long as they want to try to control this part of the market, they're going to stay proprietary, enriching themselves, but hurting the small developer and the consumer.
  • Bill Callahan · 1 year ago
    Corrected my website url.
  • justbe · 1 year ago
    That is way too complicated. Although I prefer facebook connect I can see why most blogs such as mashable have gone with google fiend connect. Facebook needs to make this easier. Friend connect is already up and running at most of the blogs that I visit.
  • Abhinav · 1 year ago
    Adding Facebook Connect to blogs I think is a very good strategy (long term), although Google offers a cut and paste method. The problem I see with Google FriendConnect is the half-baked nature of it all.
    I can’t understand their strategy of releasing half baked products like OpenSocial and FriendConnect initially then gradually adding features over a span of 8-10 months. It spoils the “aha” moment that FriendConnect gives out immediately like in the video along with a plethora of features for “viral” purposes.
    For all developers out there Facebook Connect has this great example “The RunAround” that includes all the “viral/social” features that websites/blogs can make use of.
    Here is the link to dive right into the code: http://wiki.developers.facebook.com/index.php/T....
    We (@Brainfall) went through the entire FB Connect documentation and included basically all the features – login, profile integration, newsfeed action publisher. The power it offers is quite amazing, especially if you already have an app. So lookout for the next few videos as the guys in the video said, cuz that will truly unlock the potential of blogs and rich content sites. Oh and Pete, I am really waiting for FB Connect to go on Mashable. The jobs portal, news and tons of content here will be unlocked with newsfeed integration etc.
  • BrianKissel · 1 year ago
    Very compelling tutorial and user experience, well done to Facebook. As Patrick points out above, however, this creates a dilemma for website operators who want to accommodate multiple third party login offerings.

    Rick Turoczy of Read Write Web has a good summary (http://www.readwriteweb.com/archives/janrain_rp...) of a solution that supports not only Facebook, but also MySpace, Google, Yahoo, and AOL in one unified approach. You can see this in action at Interscope Records (http://www.interscope.com/) and UserVoice (http://www.uservoice.com/session/new).
  • Eric Martindale · 1 year ago
    I'm planning on adding this to one of my larger sites, RolePlayGateway. This particular video wasn't very useful to me, but I definitely look forward to see how we can add social actions on Facebook.
  • Osvaldo · 1 year ago
    IMHO, the best strategy is to have your own login as the main one. If you use a Blog CMS (i.e Wordpress, Blogger) you already have this. Wordpress can be extended with hundreds of extensions that add features that this Facebook and Google Apps don't even dream of. It's free and YOU keep the data about the users, not Google or Facebook. Google or Facebook may change their Terms Of Service in the future and restrict your access to the information about your users.

    On the other hand, if you use Wordpress, Drupal, Joomla or many other cms's you may already have an Openid extension/plugin that you can install easily, no coding skills necessary. If your users have a Flickr, Yahoo, Wordpress.com or Blogger account, they already have an OpenID account. They don't need to create an account in your site.

    Remember that many people don't want to create an account in Google/Facebook (for example they might have a LIVE account on Myspace, Hi5, Orkut...). DON'T force your users to create an account in one of this sites just so you can use your site.
  • Christopher · 1 year ago
    Update: I added both Javier's Facebook Connect plugin and Google's Friend Connect to my blog www.Starbucksters.com in the right sidebar. No offense, but it just proves the point being made by several that Google's ootb experience is MUCH better for the general blogger audience that is much more likely to understand adding AdSense to their site than fiddling with PHP.

    In a perfect world, I'd have both available to my followers. But, until I find the time to walk through the video the plugin's UI pales in comparison and most likely would get looked over.
  • Trench · 1 year ago
    Haha - no.

    Making facebook the grand central station of the tubes is asinine.

    Don't get me wrong, this is a very good "how-to"... but, srsly, it's a "how-to do something dumb."

    Like watching a nicely made video on how to cut off your nose...

    ... to spite ur site.

    @trench gives up.
  • cuocthiseo · 1 year ago
    I have been used wordpress for facebook, but it got something quite not usable . This way is much better. THank you!
  • Mauro Magnani · 1 year ago
  • Jaswinder Virdee · 1 year ago
    Me personally i would use fb connect because i have alot more friends on fb than in my g account and the fact fb is actuallty a real social platform... What would persuade me to lean more on the side of fb connect would be if it had openid support. And as to google being more user friendly in terms of cut n paste code ... google has always made sure everyone could implement their ideas whereas facebook is more geared towards developers...but im sure there will be a cut n past solution somewhere soon
  • paul · 1 year ago
    I believe I have it running properly on my arcade site http://playuh.com. It seems to be having problems sending the call-backs to my wall when a comment is posted on a game. any advice?
  • Trin · 1 year ago
    *Comments*...I took a look at hte instructions...it does seem to take a bit of time, especially for the non programmer...I guess it means Facebook may view their demographics to no longer be teh average college person (which I am).

    Annoying.
  • Dmitry · 1 year ago
    Hey anybody knows which editor they're using for html?
  • Adam Hirsch · 1 year ago
    btw, they added the transcript for the video here: http://wiki.developers.facebook.com/index.php/F... (that should help!)
  • Eric Herboso · 1 year ago
    This video is already out of date. I don't know when it happened, but 'loggedinuser' can no longer be called as part of facebook connect. Everything else seems to work fine if you replace 'loggedinuser' with a specific user id, but what's the point if you can't call whatever the uid is of the person who is logged in?

    Note that '$user' still works when called from php, but since facebook connect doesn't allow this, then we're effectively screwed for the time being.

    Ugh. I'm thoroughly disgusted with facebook connect. It's just too complicated, and definitely not worth the time. I'd rather just stick with google's friend connect.
  • Praveen Mehta · 1 year ago
    we are using facebook connect we login into facebook but not getting userifo how i get the userinfo i m using c#.net3.5 version
  • Praveen Mehta · 1 year ago
    how to get auth_token from facebookconnect
  • cuocthiseo · 11 months ago
    Thanks for a nice tip!
  • Paul O'Brien · 11 months ago
    I've spent the better part of the week getting Connect tied into a point system only to discover a better reward/comments system from Intense Debate. Two drawbacks, they aren't connected to FCacebook and Intense Debate does a good job of restricting customization.
    Any alternatives? I want Facebook Connect profiles connected to comments that reward users.

    Thanks
  • Josh · 11 months ago
    Will, thank you for being the first one to admit it! I too, am a code dunce.
    Need a button for Blogger, WordPress, TypePad, etc.
  • Erich Trapp · 11 months ago
    This would be great if I could see the video. Remember, to reach all your
    readers you have to consider some of us are out in the boonies where dial-up
    is the only available access to the Internet, so video is impossible to see.
    How about putting the directions
    in writing as well for those of us still surfing with 2 tin cans and a string?
    Thanks!
  • Allison Reynolds · 11 months ago
    Well I got as far as
    getting the button
    in and it doing the
    logging in...they it
    returns to a page
    that does not exist
    on my blog....anyone
    got any ideas

    I agree, why on
    earth does Facebook
    not have some easy
    way to do this?
  • Tim Dodwell · 10 months ago
    Come on its not that hard! How easy do you want it! I think it is a really good step forward to the open web! Good on you!
  • Chris Moore · 10 months ago
    Sure connected in 8 mins! http://www.globaltravelpack.com
  • Usman · 10 months ago
    hi, i want ti add my blog with face book. I saw the video but still i am unable to understand that from where i start this. Pls guide me, i will very thankful to you
  • Mikey · 10 months ago
    Hey, I've tried installing this, except i'm so puzzled.
    I have copied everything on the video, and it isn't working.
    It does the function I want, except it doesn't give me my name/picture.
    Please help :]
    Thank you in advance.

    Details, if needed
    ----------------------------------------------------
    Callback URL: http://php.arbercms.com/alpha/connect/
    API Key: 77bf4da85d2a33e92498c3bdbc38870f
    Download: http://php.arbercms.com/alpha/connect/connect.rar
  • Graham Lee · 9 months ago
    Facebook connect and you guys ROCK!!! awsome tutorial thanks very much
  • internships · 9 months ago
    works like a dream
  • Paramjit Singh · 9 months ago
    fgsdfgsdf
  • Nancy Arroyo-Perez · 9 months ago
    With all the talk lately about how Facebook Connect makes it simple for you to login to other sites with just a touch of a button, you may see the usefulness of having this on your blog.
  • Nick Light · 9 months ago
    Testing :)
  • A · 9 months ago
    Video doesn't work in Google Chrome.
  • DarienNoelle · 9 months ago
    When you get into a tight place and everything goes against you, till it seems as though you could not hang on a minute longer, never give up then, for that is just the place and time that the tide will turn.
    -Harriet Beecher Stowe

    Live your life according to the light that is within you--or burn out.
  • Peter Armenti · 9 months ago
    interesting
  • Facebook User · 9 months ago
    every blog should add Facebook Connect.
  • Keith Sturgill · 8 months ago
    This just doesn't want to agree with my site. So I'm posting here to see if it posts a status
  • Keith Sturgill · 8 months ago
    Any way to remove the status update part?
  • Cletus C Lindsay · 8 months ago
    Nice.
  • Cletus C Lindsay · 8 months ago
    Sweet
  • one2love · 8 months ago
    I have just added Facebook connect via the Disqus plugin on www.soplett.com
    Seems to be working great.
  • chirkut · 8 months ago
    I want the facebook login page on the same page..
    Can anyone help me out please
  • Stephanie · 8 months ago
    This is great. I'm going to give it a try on my blog.
  • librariumonline · 8 months ago
    Exactly what I was looking for :)
  • Daniel Gargallo · 8 months ago
    Thank mates, any download link to the example?
    THank you :)
  • Facebook User · 8 months ago
    cool :)
  • Facebook User · 8 months ago
    cool
  • Jhonathan Abreu · 8 months ago
    wow very good
  • 吴玉宏 · 8 months ago
    is this from mahsable
  • 吴玉宏 · 8 months ago
    post from mashable
  • 吴玉宏 · 8 months ago
    dddddddddddffff
  • Larry Bridges · 8 months ago
    Thanks for posting this, yes it is easy to implement the login button.
  • Riyanto B. Suwito · 8 months ago
  • Miroslav · 8 months ago
    I found this very useful!!!
    10x :)
  • chat sohbet · 7 months ago
    This is sweet, but please PLEASE add an option to sort by bundles, then by frequency/alphabetic in the sidebar, not just the toolbar
  • Richard Millington · 7 months ago
    Great idea. Will be interesting to see how it takes off over the next few months.
  • Jonathan · 7 months ago
    Used a plugin ... and it worked much quicker.

    I think this will work well with our live acoustic sets. Makes it easier to quickly tell people about the shows, and the bands that are playing at the loft.

    http://www.the-loft.tv/
  • tommy · 7 months ago
    New to both Facebook and blogger. Hope this apps can help me.
  • Jay Garrett · 7 months ago
    YAY!! Sorted after some minor tweaking :)

    Thanks for that.

    J

    http://gadgetynews.com
  • sean walser · 7 months ago
    Just added the "Facebook APP " for my blog and posted a link for my readers on the front page. I literally just added it , we will see what happens. You can check it out at BUZZ-BEAST.COM.
    BUZZ-BEAST.COM
    BUZZ-BEAST.COM
  • Eydie · 7 months ago
    Can you explain this in plain English? Of is there an "Add Conect with Facebook for Dummies" book? Seriously, you need to remember that some of us Baby Boomers don't have the lingo down pat.
  • Shubhada · 7 months ago
    hello, testing...................
  • Shubhada · 7 months ago
    comment
  • idale · 7 months ago
    I activated Facebook Connect on my blog, but I HATE the way it pops up a windows for the user!!!

    Does anyone know how sites like Techcrunch have made their popup within the page in the same way alerts popup in Facebook itself???

    Cheers!
  • Kristoffer Lapointe · 6 months ago
    This website is a lifesaver.
  • tewste · 6 months ago
    test
  • deden · 6 months ago
    thanks you bro..this is very valuable information.

    Finance For Dummies
  • Erick · 6 months ago
    Apart from the video, please include simple PHP code so we can actually do this. It's nice to see an 8 minute video with little nodes and attribs being typed, but quite a different (and much more useful) thing to have some code to play with. Thanks.
  • sldksjdsd · 6 months ago
    slkdjsldksjd
  • Sankho · 6 months ago
    Hey, I just wrote a post on my blog with some directions on how to use Facebook Connect with your PHP web app - was looking around for some info and couldn't find any so decided to blog about it. Check it out if this is what you need.http://blog.sankhomallik.com/2009/06/24/add-facebook-connect-to-your-php-web-app/
  • Rob · 5 months ago
    I am all for the wordpress login
  • Rob · 5 months ago
    I am all for the wordpress login
  • CHris · 5 months ago
    This is not simple at all. Isn't this possible with just one simple script?
  • Bayar · 5 months ago
    Thats good idea
  • Bayar · 5 months ago
    Thats good idea
  • Shanx · 4 months ago
    Just use Disqus. Why bother with all this jazz?
  • Jeff · 4 months ago
    Check out my implementation! :)
  • Jeff · 4 months ago
  • Daniel Henriquez · 4 months ago
    I make all that you do it but i have the follow error: User and Email required.
  • Bijur · 4 months ago
    http://bijur.in/wp/

    Managed to finally get facebook connect installed!! Check it out! need more testers ;) and suggestions if possible!
  • Paul · 4 months ago
    In my opinion big names don't want a standard. That's the problem.

    Standards are good. Look at the example of the CD. Every computer can read and write a CD (ISO 9660). Every Player can listen to music in the same CD's

    Now look at the mess you have with Blue Ray and HD DVD. Two systems because the industry wanted to force their own standard.

    Look at the mess with the cards for the photo cameras (XD, SD, Compact Flash, Memory Stick...) Every time you change the brand of your digital camera you may have to buy new cards. Now look how the GSM standart made things simple with cell phones. Your number is a GSM card, it doesn't matter if you use Nokia, Sony, Samsung, Alcatel...

    Can you explain me (and everyone watching this thread) how a market fight in the next years for a dominant login system is going to help the users ? It may be a never-ending fight...

    Cheers
  • Keith Barrett · 4 months ago
    I finally got both Twitter and FB Connect working on http://keithbarrett.com , but I really had to customize them and I still get HTML validation errors for the FBconnect button even with the proper headers defined.

    I was planning to switch to Disqus but the Twitter button doesn't appear and I can't get all my comments to migrate into the service
  • Keith Barrett · 4 months ago
    I finally got both Twitter and FB Connect working on http://keithbarrett.com , but I really had to customize them and I still get HTML validation errors for the FBconnect button even with the proper headers defined.

    I was planning to switch to Disqus but the Twitter button doesn't appear and I can't get all my comments to migrate into the service
  • Hussein Nasser · 3 months ago
    Really cool! and easy
    is there something similar with Twitter?
  • James Howard Young · 3 months ago
    I'm wondering if the Facebook Beacon settings are related to Disqus / FB connect
  • James Howard Young · 3 months ago
    otherwise I can't figure out why it's broken for me! :(
  • Raphael Mutiso · 3 months ago
    Very cool tutorial
  • John Roescher · 3 months ago
    Seems like using a service like DISQUS or IntenseDebate would be a better way to connect.
  • homepokergames · 3 months ago
    Thanks for the article, but I still don't get it - what are the advantages of doing this? I was expecting your comment to be posted back to Facebook with a link to this - but there seems to be no return traffic, it just logs you in? What happens next?!
  • Dara Grieger · 3 months ago
    Didn't help me at all...I have no idea about code or anything! And I'm trying desperately to drive traffic to my blog to raise money for a charity, failing miserably. This would be helpful if the average person could do it!
  • shawnrichard · 3 months ago
    Click to facebook
  • shawnrichard · 3 months ago
  • shawnrichard · 3 months ago
    really good content
  • shawnrichard · 3 months ago
    Mercator contents are very nice. it is very helfulful for comming interviews