20.9.10

Facebook Comments Integration

Hey, 
This time i'll show you how to integrate Facebook Comments into your website using 
  1. Facebook JavaScript SDK
  2. XFBML

First of all Sign up to Facebook ;) (Duh)

After you have an account you need to verify your self as a developer.
You need to go Here and follow the steps, a code will be sent to your Phone and you need to type it there and you will get confirmed.

Now you need to sign up for an application go here - Create an Application.
And fill in the necessary fields.
Notice: You may get "Sorry, an error has occurred" - This is bullshit !

After you get this error or succeeds to create application go to My Applications.
Inside your application you'll see Application ID, We will use it later.
Notice: It can take between 2 to 20 minutes until it will be ready to use.


Now go to the page that you want to the FB Comments to it, go to your <html> tags and add this line inside the tag: xmlns:fb="http://www.facebook.com/2008/fbml"
So now your <html> tag should look like this: 


<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
After the <body> tag add this:
<body>
<div id="fb-root"></div>
<script src="http://static.ak.fbcdn.net/connect/en_US/core.js"></script>
<script>
    FB.init({ apiKey: 'YOUR APP ID',
              status: true,
              xfbml: true });
    FB.XFBML.parse();
</script>

And change 'YOUR APP ID' to the  Application ID we got before.
Now go to Comments Social Plugin on facebook, and generate the code you would like to use.


for an example i use:
<div id="RectFacebookComments">
    <fb:comments xid="123" width="640" canpost="true" candelete="true"></fb:comments>
</div>
Now offcourse that we want a Dynamic xid...
This is how you do it in ASP .NET (C#):
Go to the page.cs file and create a method that returns the ID you want as a string:
public string GetID()
{
    if (Request["id"] != null)
        return Request["id"].ToString();
    return "";
}
And change xid="123" to  <%GetID();%> :)
Thats it your done :D
Let me know if you have any questions ;-)

4 comments:

  1. Its very nice blog but I want to retrieve those comments from facebook. So please give me proper solution.

    Thanks

    ReplyDelete
  2. @Supid
    What do you mean retrieve those comments from facebook?

    ReplyDelete
  3. looks simple but very handy stuff, i am trying to write in VB but the question is where do you write this function and when do you call it.
    appreciate your help.

    ReplyDelete
  4. @Sarfaraz
    Hey, add this function (in VB syntax) on you Page.cs file.

    Now, change the line (on the .aspx page):
    fb:comments xid="123"
    to
    fb:comments xid="<%GetID();%>"

    I hope it helps :)

    ReplyDelete