we have clients on 5 continents
They sought us out for our mad skills
Article
How to Add Facebook Comments to My Website

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.

How to add Facebook comments to my website

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:

Facebook Comments Box code generator

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}”/>

Posted in: Article
Actions: E-mail | Comments (14)

Comments

Ali
Wednesday, June 01, 2011 2:12 PM
Do you know how you can set it up to notify me when I get a new comment on my website? Otherwise there will be possible questions left unanswered?
Ali
Wednesday, June 01, 2011 2:13 PM
Do you know to set it up to notify me when I get a new comment?
Web Design Bolton
Monday, July 25, 2011 5:19 AM
Really nice.
Carlos
Thursday, August 11, 2011 12:17 AM
I pasted the code on to my webpage but after publsihing it does not show the comments box. Any suggestions?
Thanks,
Saturday, August 20, 2011 3:27 AM
There is obviously a lot to learn about this. I think you made some good points in your article.
Sunday, September 04, 2011 5:03 AM
Thank you so much! After searching 5 different sites, I finally found yours - the golden egg with ALL the answers. My FB comments box is working fabulously.

Thanks again!
Friday, September 16, 2011 8:49 PM
Facebook commenting is a backlink strategy , which they are using it to there benefit. Usie analytic tools to find out for yourself
Thursday, October 13, 2011 5:06 PM
I too pasted the fb api, old ie and the comments codes on my page but the comments box does not show! Please help!
Mike
Friday, October 28, 2011 8:40 AM
Excelent plugin!!

You can see an example about how to assemble facebook comments with your side in this page:

http://aplicacionesfacebookparadummies.blogspot.com/2011/10/integrar-comentarios-en-tu-web-con.html
Wednesday, November 09, 2011 3:35 AM
Great post. I found what I was looking for. Do you mind if I post this on my website and give you credit? If not, it’s ok.http://www.2jdesign.co.uk/
Wednesday, December 14, 2011 6:51 AM
You make it so easy for me and I will share this informative post on my facebook account as well.
Sunday, December 25, 2011 9:36 PM
Shout out for the entry
Wednesday, February 01, 2012 11:01 AM
Thanks for this! I used the FB comments box code and it worked a treat.
Julia
Friday, February 10, 2012 1:20 AM
Social networking like Face book and twitter are providing a strongest platform through which you can easily get publicity of your website and online business. This may take some time to establish business but this is most quick and fast method of achieving best place in business.

Post Comment

Name (required)

Email (required)

Website

CAPTCHA image
Enter the code shown above:

     The blog is one way to stay current on all things Web Ascender. On this page you'll find articles with tutorials, advice, industry news, and other general Web Ascender announcements.  Checking this page regularly (or subscribing to our RSS feed) will help you get the most out of SiteCTO, Enlighten, and our other web marketing and tracking services.

    Michigan Website Design and Development | Link to Web Ascender  |  Related Content
    Michigan Web Design Blog