Facebook share allows you to define certain portions of page preview. You can define them using the following tags:
[html]<meta name="title" content="title" />
<meta name="description" content="description " />
<link rel="image_src" href="thumbnail_image" />[/html]
Here i will show you how to implement a post thumbnail meta in order to show the right image in the post preview.
Those tags go to header.php which defines your page’s styles and meta informations.
- Open the header.php
- Paste the following code before <?php wp_head(); ?>
[php]global $wp_query;
$thePostID = $wp_query->post->ID;
if( has_post_thumbnail( $thePostID )){
$thumb_id = get_post_thumbnail_id( $thePostID );
$image = wp_get_attachment_image_src( $thumb_id );
echo "<link rel=\"image_src\" href=\"".$image[0]."\" / >";
}[/php]
(Don’t forget to wrap it up with<?phpand?>if it doesn’t exist.) - Save and upload the file to your theme directory. Voila!
You can also use my Facebook Meta Tags for WordPress plugin. It automatically inserts related tags to your site.
Don’t forget to put a facebook share button to your site. You can get one here.
You can read more about facebook meta tags here.
Cheers!


5 Comments
this is very useful!thank you~~~
thanks irene
if i have multiple image in a webpage, how can I force the Sharer to use only one thumbnail, meaning, there will be no option to select other thumbnails?
Facebook looks for other images in your page and allows users to use them too.
One trick would be using other images as background in your CSS file.
Facebook doesn’t use css files while searching images.
Thanks for your reply, but that would seem impractical for our usage as we are using animated gifs on some of our images.
Thanks anyway
i’m looking into using the stream.publish
One Trackback