Add Facebook Comment Box to Websites

With the recent introduction of Facebook’s new and improved social plugin Comments Box, third party websites can not only add Facebook comments to their website, but they also have the option to sync comments directly to user Facebook pages. While in the past, the Comments Box served merely as a static addition to third party sites, it now has the capacity to provide direct communication between a website, a Facebook user, and all of his or her friends.

Using the new Comments Box, if you were to comment on a website such as Web Ascender, you would be given the option to post both to WebAscender.com as well as to your Facebook wall and the newsfeeds of all of your friends via the checkbox seen above. In addition, if a friend of yours were to comment on your wall post, that comment would also appear on WebAscender.com. What’s more is that not only can you comment on third party sites using your personal Facebook username, but you can also leave comments under the name of a Facebook Page.

Also included in the new Comments box is a feature intended to increase quality of the plugin for users. Using social signals such as friends, friends of friends, and most liked or most active discussion threads, the Comments box will personalize results for each user.

How to add the Facebook Comments Box to my website

Facebook offers a simple and easy to use Comments Box code generator which looks something like this:

Insert the URL you want Facebook to link to, the number of posts you would like displayed be default, and the width you want your Comments Box to be, then click “Get Code.”

Or, add the Facebook Comments Box using the following code:

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=APP_ID&amp;xfbml=1"></script><fb:comments href="YOUR URL HERE" num_posts="10" width="500"></fb:comments>

Attributes

Href – the URL for the specific Comments plugin. Newsfeed stories on Facebook will link here.

Width – the width of the plucin in pixels (minimum width: 350px)

Num_posts – the number of comments to show by default

Moderation

Before adding admins to your comment box, you must first locate the ID of the user you wish to add. To do so, hover over a link to the user’s name on Facebook, and a URL will appear in the lower left hand corner of your browser. Toward the end of the URL, you will find “id=” followed by a set of numbers. Those numbers make up the user ID.

Now that you have found your ID, you can add admins to your Comments Box by inputting the user IDs of each admin, separated by commas, into the following tag:

<meta property=”fb:admins” content=”{USER 1, USER 2, etc.}”/>

You can also associate a Facebook app with your Comments Box, automatically making all admins of the app admins of your Comments Box as well. Do so using the following tag:

<meta property=”fb:app_id” content=”{YOUR ID HERE}”/>