Facebook recently updated its Comment System. Details are listed here.

How to add the new feature to your wordpress blog?

Step 1

Go to Facebook’s Comment System code generation page. ( link ) . Enter the details relating to your site.

Facebook New Comment System Code Generation

Step 2

Press “Get Code” to get the Facebook code.

Note: you will need to register your site to get an application ID to be used in the Comment System. To register your site, go here. For detailed help and description regarding registering and creating an APP ID, visit this site. ( link )

Facebook New Commenting system get code

Step 3

When you get the code, you will have to make some changes before it can be used in your site.

1. Replace the site link with post link

Why we are doing this is because while generating the code we mentioned “aneeska.com” . This means that the above piece of code for all posts in aneeska.com. So that comment done in one post is visible through out the whole site. Thats why we need to edit the code generated by FB in the above step to cater to this.

What the following step does is to add “<?php the_permalink(); ?>” as the link for FB comment system.

Use the following code

<div id=”fb-root”></div><script src=”http://connect.facebook.net/en_US/all.js#appId=YOUR_APPLICATION_ID&amp;xfbml=1″></script><fb:comments href=”<?php the_permalink(); ?>” num_posts=”3″ width=”500″></fb:comments>

Replace the YOUR_APPLICATION_ID with your Application ID. ( You will get it from the code generated in Step 2.)

2. Add Meta ID to header.php

Copy the below code and add it to header.php of your theme file. Make sure it is placed before </head> tag.

<meta property=”fb:app_id” content=”YOUR_APPLICATION_ID“>

Note: Replace the YOUR_APPLICATION_ID with your Application ID

Step 4

Open your wordpress theme’s comments.php file. Insert the above Facebook code (generated in Step 3 section 1) into appropriate section.

What did I do?

In my comments.php file, I inserted the code after listing all the existing comments. Also I removed the default comment form the theme came with. I left the rest of the code as it is – including the trackback listing section.

Is this useful?

Let me know in comments.

Don’t Miss a Thing! Subscribe Us

Subscribe to Facebook Page Subscribe to Tweets Subscribe to RSS feed Subscribe to RSS feed

Sorry, the comment form is closed at this time.If you want to send me a message you can use the contact form available here.