Auto Force Facebook Share Thumbnail for WordPress Posts

Facebook offers a great way to share links with your friends from your wall or page. The best part of the Facebook Share Area is the thumbnail feature in which you can add a preview thumbnail for the article or site you are sharing. The only problem that can occur at times is that people sharing your posts on Facebook sometimes are faced with up to 30+ thumbs to go through as an attachment to your posts. These thumbnails can be selections of images if your posts, images from gravatars in comments or even images from your sidebar.

Since many people using WordPress are already creating custom images or thumbnails for their posts you can actually force Facebook to use that exact same image.

Now this may not be ideal for everyone but imagine if you are running a site that deals heavily with online video. If your site also has a zine type theme you most likely have a thumbnail created for your category section along as being used as a teaser on your main page. To take is a step further, this thumbnail may also be the same image that you use in your related posts area, since we know that a related posts section is always better when there’s visual attached to it.

The Facebook Code

The Facebook Developer Wiki shows the above as the basic tag for specifying a preview image, this code goes in your section. Since we are working with WordPress and our site is always evolving choosing one image won’t work unless you want your logo to appear for every single link shared.

The Facebook Code Redux WordPress Custom Field

ID, 'Image', true); ?>

The above is a modified version of the Facebook Share image_src code. If you are using some sort of post preview thumbnail for your main page, category and/or related posts chances are you using the WordPress Custom Field option along with a Value.

In the above example, ‘Image’ is the name of our custom field and echo $image returns the value that you enter for each post. The “Value” section in your “Edit Post Section” is important since some themes require an absolute URL while other sites could require a path starting at wp-content/ possibly /uploads or similar. The above example assumes your Image value starts with wp-content/uploads/folder/file.jpg

So if your value requires an absolute URL your code would look like this:

ID, 'Image', true); ?>

The Facebook Code Redux WordPress Custom Field Single Posts Only
The above code would go in your header, in the section of your template. If you only want to force a Facebook thumbnail for your single posts you would simply add a WordPress Conditional Tag to say “Hey WordPress only add a thumbnail for single posts!” You could also assign a default thumbnail picture for every page that is not a single post or just leave the line empty to display no thumbnail for the non-single post, just remove the line after the else statement.

ID, 'Image', true); ?>

Things to Remember
1. The above techniques work best for WordPress Themes that require the creation and use of thumbnails for each post that is written.
2. There are many other ways that WordPress Themes create thumbnails for use. Your theme may use an auto-thumbnail script like TimThumb or phpThumb