Adding Facebook Commenting to News Articles

May 18, 2014 3:45 pm

In order to get Facebook commenting ability on your news articles like this:

1. Go to https://developers.facebook.com/apps

and click Create New App.

Fill in the app name something like "yourWebsite_News_comments" and click save.

2. Then go to:

https://developers.facebook.com/docs/reference/plugins/comments/

Press the Get Code button in the configuration box.

From the pop-up, click on the XFBML tab to pull up three boxes.

Notice that this box says "This script uses the app ID of your app: "
and shows the app name you just created.

3. Copy the first box of code and place it a the bottom of your News Detail Module Layout
(Green > Layouts > Modules Tab > Look for [Detail] in the News section).

4. Then copy the following code and place is just above the code you just pasted:

<script type="text/javascript">
var the_url = window.location.toString();
document.write('<fb:comments href="' + the_url + '" width="470" num_posts="10"></fb:comments>');
</script>


5. Save your News Detail Module Layouts and then go to your Default Page Layout
(Green > Layouts > edit [Default])
Note: This should be whatever layout your News Detail page is using.

In your Default Layout, make sure your <html> tag at the top has an XML namespace like in box 2 of the Facebook comment developer code.

Now, when you load your news articles, you should see the Facebook Comment box at the bottom of your article.