How to use the Facebook Recommendations plugin in wordpress.com

If  you have been using the Facebook Like feature or the “Share on Facebook” button in your wordpress.com blog posts, you might want to use the Recommendations plug-in by Facebook.

Recommendations

The Recommendations plugin shows personalized recommendations to your users. Since the content is hosted by Facebook, the plugin can display personalized recommendations whether or not the user has logged into your site. To generate the recommendations, the plugin considers all the social interactions with URLs from your site. For a logged in Facebook user, the plugin will give preference to and highlight objects her friends have interacted with.

You specify a site for which to show recommendations for. The domain is matched exactly, so a plugin with site=facebook.com would not include URLs from developers.facebook.com. You cannot currently aggregate across multiple domains.

The plugin is available either via a simple iframe you can drop into your page, or if you are using the new JavaScript SDK, you can use the XFBML tag.

From Facebook

Log in to your Facebook account and click the image to go to the Recommendations page in Facebook.


Facebook Recommendations for wordpress.com

Write the url of your blog in the Domain field and make the necessary adjustments.
Click Get Code.

Now the code is ready for pasting wherever you want in your blog.

But no!

There is a problem, The two types of codes available for blogs are useless for wordpress.com blogs, since wordpress.com doesn’t allow us ordinary mortals to paste iframe or javascript.

But I am not gonna take “NO” for an answer and if you are like me, then read on for a workaround and you can have Recommendations in your wordpress.com blog! :D

Workaround #1
Use a text link that links to the Recommendations page for your blog.

Choose the first code, it has iframes.

Facebook Recommendations

Paste the code in a new blog post, but do NOT save it.

Look at your code carefully. Put the cursor before the http and delete everything before it. Now look at the end bit of the code. Put the cursor after “true” and delete everything after it.

Take a look at the following code:

Modified code as per this tutorial

http://www.facebook.com/plugins/recommendations.php?site=http%3A%2F%2Fshongjog.wordpress.com%2F&width=300&height=300&header=true&colorscheme=light" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:300px;" allowTransparency="true"

The modified code is the url that has the Facebook Recommendations specific to your site.
Now you need some text that will link to it.

Under the codes write the words Polular @Facebook or anything that you think will tell the readers what it is.

Now cut the code. Select the text Popular @Facebook and click the link tab. Paste the code in the link tab.

Now select everything and cut it.

Go to the widgets page of your blog, select a Text widget, paste the code and click “Save”.

Now visit your blog and click the text link you have just put in your side bar.

You can view the Facebook Recommendations page and so can your readers when they click the link!

Now, how cool is that! :D

If you click the link below, you will be able to see the results for this blog according to Facebook Recommendations.

Popular @Facebook


Bonus tip
If you choose a bigger number for the height attribute in the code generator, there will be a greater number of posts in the linked Facebook Recommendations url.


Workaround #2
Create an image link – it helps make things more visual within your blog.

If you click the above image, you will be able to see Recommended posts from this blog.

When you get the modified url (by editing out the unwanted bits in the code as per the how-to in workaround #1), paste it in a new Firefox window and relaod it.

When the page loads, click the Kwout button in your browser and cut out the portion that has only the Facebook social plugin contents. Upload it. Copy the code Kwout gives you and paste it in a text widget. And the Recommendations will turn up in your side bar! When clicked, the image will take the reader to the actual url that has clickable links to the recommended blog posts in your blog.

If you do not know what Kwout is, please read the following tut.

Turn a web clip into an image and generate an image url at Kwout


Bonus tip
:idea: You might want to change the image from time to time to maintain a fresh look in your side bar.

7 thoughts on “How to use the Facebook Recommendations plugin in wordpress.com

Comments are closed.