How to add Facebook Comments Box widget on your website in 3 steps

[Update] Facebook has again updated its Comment box widget so please go to this Adding Facebook Comments Box to yuor website post

So you want to add Facebook Comments Box Widget on your website to let your visitors to comment on your content, whether it’s for a web page, article, photo, or other piece of content. Then the user can share the comment on Facebook on their Wall and in their friends’ streams.

Here’s how you can add this Facebook Comments social plugin on your website in three easy steps.

Step 1

Before you could get your hands dirty with the code of the website, please go to http://www.facebook.com/developers/createapp.php and get an APP_ID for your website.

Step 2

Having armed yourself with the APP_ID, go to Facebook Comments Social Plugin setup wizard page here http://developers.facebook.com/docs/reference/plugins/comments, and click on the “Get Code” button, don’t worry about the “Unique ID” field at the moment, (we will generate it in our website code dynamically orhard code it if it’s just a static page), copy the code from the popup window for iFrame or XFBML version, you will see following code (or similar):

Step 3

Please replace APP_ID with the actual app id of your application you created in the first step.

Also provide xid=”YourWebsite-article-ID” which should be a unique ID across your website pages. You can place any unique number here such as “MyWebsite-1234” or if you have a bigger dynamic website, you can easily generate it dynamically using the url of the web page in php or any other server-side language. For a php website, you can use following code snippet: