Grow your CSS skills. Land your dream job.

[Solved] Add a Facebook news feed to your Website???

  • # June 5, 2011 at 11:02 pm

    Hey everyone,

    Has anyone ever successfully added a Facebook status feed to a website? I can access both the XML and JSON for status feeds but anytime I try to display it on my site I get an error telling me that the XMLHttpRequest cannot load http://www.facebook.com/feeds/page.php?id=112140545537576&format=rss20. Origin is not allowed by Access-Control-Allow-Origin.

    It appears that I need a Facebook OAuth ID, I’ve been to this page: http://developers.facebook.com/docs/authentication/ and seem to keep going round in circles.

    I’ve followed a tutorial in Web Designer Magazine titled ‘Add a Facebook news feed to your Website’, which is great apart from the fact that it doesn’t mention anything about OAuth ID’s and their tutorial files don’t work as they require one.

    Am I missing something here? It IS possible to display facebook status updates on your website right??

    Any help would be much appreciated. I’ve spent all evening googling, looking through various tutorials and scouring the facebook developer site.

    Many thanks in advance,

    John

    # June 6, 2011 at 9:12 pm

    No worries I figured it out..

    Had to sign in as a developer: https://www.facebook.com/developers/

    Then ‘Set up a new app’, which will give me an ID and an app Secret.

    I then make a GET request to ‘https://graph.facebook.com/oauth/access_token?grant_type=client_credentials&client_id=CLIENT_ID&client_secret=CLIENT_SECRET’ which gives me an Access Token.

    I can then use that to access the JSON data: https://graph.facebook.com/PAGE_ID/feed?access_token=ACCESS_TOKEN

    Bit more complicated than I expected but managed to get there in the end. Just thought I’d post this in case anyone else came across this problem in future.

    John

    # June 16, 2011 at 11:45 am

    PS. I wrote a brief tutorial about it here if anyone needs an example: http://johndoesdesign.com/blog/2011/php/adding-a-facebook-news-status-feed-to-a-website

    # July 27, 2012 at 12:09 pm

    Hi johnny, great post and thanks for this tutorial. I just have one question:

    I also want to integrate my facebook newsfeed to my website, but I also want the option that people can interact with the content (from facebook) on my website. For example: when someone visit my website and he wants to comment , like or share (just like you can do on Facebook) an update, they can do that on my website instead of Facebook. Do you think that’s possible?

    Like to hear from you!
    Dennis

    # July 27, 2012 at 12:43 pm

    Thank you for this tutorial =)

    # July 27, 2012 at 1:42 pm

    Thanks John! I really needed it!

    # July 27, 2012 at 2:01 pm

    Sweet addition! Thanks for sharing.

    # August 29, 2012 at 10:46 am

    Great article. I was just wondering if anyone is experiencing loads time of over 4/5+ seconds when implementing this. My page loads fast without but extremely slow with.

    # September 11, 2012 at 12:19 am

    actually

    we have a fb page

    and we have own web site

    i need to add facebook status to my web page

    here :
    – >>i have followed what u posted

    i can able to feed the datas to my site but that was expire 60 days and i tried to debugthe new token and i get the new one.
    that new token has expire with in 20 min

    actually that app page created by different developer

    he set that access token

    but now we need to set long live access token

    please suggest me and give me some correct referance url

    bcz i was struggling this thing on past one week


    i need to access n generate nw token –

    that page created by another developer

    and am the new developer

    please reply me asap…. bcz i was stuglin so long

    more then 7 days

    for this only one

    do the need full thankq……..

    your post is very useful

    # October 13, 2012 at 1:54 am

    I would want to include at my website http://www.satelliteview.org Facebook buttom. where can see some manual?

    # January 14, 2013 at 2:20 pm

    ^^^^^^ This fucking guy

    # February 11, 2013 at 8:29 am

    in case you still need it, you can display facebook page feed on website without using any keys, here is the link to the tutorial.[ display facebook feed on website.](http://www.codeofaninja.com/2012/06/display-facebook-feed-on-website.html “display facebook feed on website”)

    # July 4, 2013 at 9:08 pm

    If you are looking to set this up for just a Facebook page it is pretty simple to do. You do not to create a Facebook app or get authorization. This is the video I made to show it. http://youtu.be/U2cGmnzlN_k

Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".