I added an AddThis button to this site today (right above this line, it says 'share' on it), and, for the third time recently, I tested the Facebook sharing link and found that the wrong image popped up. Facebook grabbed the correct text this time, but, since that's been a problem for me in the past, I'll discuss how to solve that too (in short: use the meta tags module).

The solution to the image problem is pretty basic, but if you're a Drupal newbie you might find it a tad tricky.

When you give Facebook a link to share, Facebook will look at the link's meta description tag and its link image_src in the head of the HTML.

For example:

Example: head content Facebook looks for

<meta name="description" 
    content="Facebook uses this for text!" />
<link rel="image_src" 
    href="http://example.com/facebook-will-use-this.jpg" />

If your page doesn't specify what you want Facebook to use, Facebook will do its best to find an image and description for the page somebody is trying to share.

On Left-click, Facebook, found a silly image in the worm builder block we have.

Of course, that has nothing to do with the article, which is about Horde webmail. I decided it would be good enough to just set the Left-click worm as the image for every blog post. In my theme's template.php file, I added this code:

Example: set a default image for facebook's share.php

<?php
if(arg(0) == 'node') {
  drupal_set_html_head('<link rel="image_src" 
    href="http://www.left-click.us/files/burg-worm.jpg" />');
}
?>

And got this (note: Facebook caches this information, so you'll have to test on a different article each time until you get it right):

Perfect! It's another quick step to use an image entered for the blog post in a CCK field. See the example below for that.

Example: set Facebook share image using CCK/default

<?php
if(arg(0) == 'node') {
  if(!empty($node->field_images[0])) {
    drupal_set_html_head('<link rel="image_src" 
        href="'.check_url($node->field_images[0]['view']).'" />');
  } else {
    drupal_set_html_head('<link rel="image_src" 
        href="http://site.com/defaultimage.jpg" />');
  }
}
?>

One important thing to note is that this only works for one image. As of now, you can't tell facebook about a bunch of images and then let the user pick the one they want to show. I've seen some complaints on Facebook forums, but no solutions.

Now, if Facebook is grabbing the wrong text, you'll need to set the meta tag. This can be done in a few ways. The easiest way, as I said before, is to simply use the meta tags module. That does a pretty good job out of the box.

If you have more complex needs, just do it by hand like we did for the image.