This week Facebook released a mayor upgrade to their existing Facebook Comments plugin. This plugin, part of Facebook's Social Plugins, lets visitors comment on your site's content. In this post some details about the upgrade and an issue I ran into when upgrading the plugin on one of my sites.
The intro video is quite cool, I suggest you check it out and read the instructions page and the post on the Developer Blog, if you want to use this plugin.
What's so cool about this upgrade?
1. Most interesting comments first (friends and "most liked" comments first)
2. You can reply from the news feed which will be synced back to the comment box on your site. So this allows for easier interaction with your content's comments and potentially more traffic to your site.
3. When somebody replies to your comment you will be notified in Facebook
4. Admins have control via a whole new moderation dashboard which let you handle comments of all your FB apps. Also moderation has more options now.
5. Easy to upgrade the first version of the comment plug-in by adding migrated="1" in the fb:comment tag
What is less cool?
1. Privacy. One aspect that might disturb people is that Facebook shows more context about the person that places the comment, like country and work place. Of course this can be minimized by adjusting your privacy settings, but I can imagine that people might be surprised when they put their first comment on another site that uses the new version of the plugin.
2. Issues with the migrating and fql-ing all comments of an app .. see further down
3. Fixed width of 500px, if you use a smaller width, different text elements will overlap. I reserved 410px for the previous version so I had to tweak the CSS of my app to neatly fit in the 500px box. It could be that Facebook will address this in the future.
Code
As before, it's plain easy to deploy:
<div id="fb-root"></div> <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script> <fb:comments href="YOUR_CANONICAL_URL"></fb:comments> (with the migration="1" flag if you upgrade an existing code snippet)
Migration issues
On sharemovi.es I have comment box per movie url, so I had a serious challenge to check back and forth v1 and v2 of the plugin.
I had to skim through the comments on the developer blog to figger out that when you didn't use the XID flag in the first version of fb:comments , like :
<fb:comments xid="YOUR_XID" migrated="1"></fb:comments>
.. you wouldn't see your comments in the new version. Holy crap, all the movie comments were gone! In the end I got it fixed by urlencoding the URL. There was a bug in the code requiring you to urlencode the url twice. Facebook got this quickly fixed and the comments came back with the following snippet (pff.. )
<fb:comments migrated="1"
xid="<?=urlencode("http://".$_SERVER["HTTP_HOST"].$_SERVER["REQUEST_URI"])?>">
</fb:comments>
Querying comments with FQL
Another thing that got 'broke' was the listing of number of comments. A shame, because I was quite glad with my code that could extract the number of comments per movie URL. Clicking the number would get you an overlay with the comments, styled with my own CSS. So comment box generated content extracted to other parts of the site.
Unfortunately this doesn't work anymore
$fql = 'select xid,count from comments_info where app_id=<<my_app>>'; $param = array( 'method' => 'fql.query', 'query' => $fql, 'callback' => '', 'access_token' => $session['access_token'] ); $fqlResult = $facebook->api($param);
The newer method Facebook proposes would be something like the following, but I cannot get it to work for my URLs:
select post_id, fromid, time, text, post_fbid from comment where object_id in (select comments_fbid from link_stat where url="http://developers.facebook.com/blog/post/472")
I will be checking this further of course, when I have the solution I will post it here .. Of course if somebody reads this and has found the solution, please put a comment here with the solution :)
Number of comments
Just new in the FAQ of the comments plugin is the number of posts for a particular URL. Unfortunately it doesn't work for sharemovi.es but it is a cool new feature, and it seems Facebook replied very fast on requests from users here:
<fb:comments-count href=http://example.com/></fb:comments-count> awesome comments or
<iframe src="http://www.facebook.com/plugins/comments.php?href=example.com&permalink=1" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:130px; height:16px;" allowTransparency="true"></iframe> Examples new comment plugin
Currently I am using the comment box on my two Facebook Apps to let users comment on movies and books:
sharemovi.es (blog post: Sneak preview: sharemovies)
my reading list (blog post: Hi folks, what are you reading? Share it on “My Reading List”
Like this post?
Share it using the social media buttons at the top and bottom of this post. Or post a comment, I like to hear from you ..
