Facebook plugin allows you to add a comment section to your webpages. This plugin accepts logins from Facebook, Yahoo, AOL etc. The code to add the plugin can be found
here.
Adding the code that you get from the link above is straight forward, however there are a few issues that you will need to address to get it working properly on your website. Recently I addressed these and found a working solution.
Issue No. 1 - Separate comments for each webpage for your website
Facebook records comments for each "data-href" URL that is provided in the plugin code. So the trick is to modify this "data-href" field for each web page of your website. Of course doing it manually can be very cumbersome. So I've written following JS code that does some basic cleanup on the URL and then plugs this "cleaned up" URL in the "data-href" field.
----------------------------------------------------------
<script type="text/javascript">
<!--
var strng = location.href;
var splits = strng.split("&");
var splt2 = splits[0].split("?fb_comment_id");
document.write('<div class="fb-comments" data-href="');
document.write(splt2[0]);
document.write('" data-num-posts="4" data-width="600"></div>');
// -->
</script>
---------------------------------------------------------
Issue No. 2 - Making comments Moderatable
add the following code after the head tag in your HTML. Replace the content field ^^'s with your APP ID
---------------------------------------------------------
<meta property="fb:app_id" content="^^^^^^^^^^^^"/>
---------------------------------------------------------
After you have added this code. You can go to
this page to moderate comments.
Issue No. 3 - Making Facebook Comments Indexable
This is very important step for SEO since Facebook comments are pulled from Facebook API's within a JS and are not indexed by Search engines, which is a big hit to SEO. Remember the same URL "cleanup" step to do here as the first step when you plugged the cleaned up URL in the "data-href" field. Following PHP code uses cUrl code to pull the comments data from Facebook and displays it on the webpage.
One issue with this presenting of comments data on your webpage is that "How do you show it on your page". Answer to this I dont know. One straight forward option is to hide it under "div hidden". But that is questionable choice. Since Search Engines do not like hidden text on your webpages. In the case of hiding Facebook comments data on you webpage is a genuine need, since the comments are already shown to the user from the plugin code, BUT that is something search engine is unaware of. Hiding text can get your website unindexed from search engine, sort of blacklisting.
Another issue with following code is that it bypasses security. cUrl code disables SSL options to be able to get this working. You may want to search a bit more and see if you can get SSL part working as well that is without disabling options.
---------------------------------------------------------
<?php
$ch = curl_init();
$timeout = 5;
$url = (!empty($_SERVER['HTTPS'])) ? "https://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'] : "http://".$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI'];
//echo $url;
//echo ("<br/>");
$pieces = explode("&",$url);
//echo $pieces[0];
//echo ("<br/>");
$splits = explode("?fb_comment_id",$pieces[0]);
//echo $splits[0];
//echo ("<br/>");
$request_url ="https://graph.facebook.com/comments/?ids=".$splits[0];
//echo $request_url;
//echo ("<br/>");
curl_setopt($ch,CURLOPT_URL,$request_url);
curl_setopt($ch,CURLOPT_RETURNTRANSFER,1);
curl_setopt($ch,CURLOPT_CONNECTTIMEOUT,$timeout);
curl_setopt ($ch, CURLOPT_SSL_VERIFYHOST, 0);
curl_setopt ($ch, CURLOPT_SSL_VERIFYPEER, 0);
$data = curl_exec($ch);
// print "<div style:visibility="hidden">";
print "<PRE>";
print_r($data);
print "</PRE>";
// print "</div>";
curl_close($ch);
?>
----------------------------------------------------------
In case I've missed anything I'll revisit the post, after checking any comments. Of course the disclaimer - Use all of this information at your own risk.
