Adding Facebook Share to Drupal

Posted Saturday, November 7th, 2009

Adding facebook share to drupal

I’ve seen a few people on drupal.org how to implement Facebook Share and asking for modules, etc. However with the share widget provided by Facebook it’s really very easy to implement FB Share at the template level. To make it really easy, use CCK.

Step One: Get the Widget

To start off, FB provides you with this code in their widgets section

<a name="fb_share"></a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"><!--mce:0--></script>

Which gives you a little widget on your webpage that looks like this,

facebook share preview

That’s pretty quick and easy. Using that bit of javascript you’ll get a little FB button that you can stick basically anywhere on a page (or, more precisely in your node.tpl.php file) and when the user clicks it, they’ll be prompted to login to facebook (if they’re not already) and then they can share your link on their wall. FB is pretty good at scraping pages but if you want fine tune control over what image and what text is displayed with your link you need to go a step further.

Step Two: Take Control!

As an example, this is the code I added to my page.tpl.php template right underneath my <title> tag:

 
//

I’ve made references to three variables here; $title is just the title of my page, $node->field_fblink_teaser[0]['safe'] is a CCK field that I’ve created which allows users to specify a meta description of their page and lastly $node->field_fblink_image[0]['filepath'] is an image that user uploads that is used to create a thumbnail for the FB Share wall post. I’ve defaulted this image to 100x100px since that is what FB seems to like. For more info on linking different kinds of media including audio and video, check out this page. Although there are no guidelines given anywhere else, FB does actually have minimum/maximum sizes for images, so if you’re image isn’t showing up try changing the dimensions.

In the end you should end up with a wall post that looks like this,

fbshare

Disclaimer: I don’t advocate using Facebook. For anything. It’s a popular platform and website, yes. But you should be aware that Facebook likes to change their rules, often without warning. It can be a bit of a nightmare for developers. That said, Facebook Share is relatively low-impact though (all authentication takes place via facebook) and that makes it quick to implement.

Updated on April 4, 2010, plugin update killed my example code.

Tags: , , , ,

Comments are closed.

Blog Navigation

Categories