Customizing the Image for Facebook Shared Links

Posted: May 16, 2011

This post is outdated. Click here to view how to customize your Facebook content using Open Graph.

Sharing tools and Like buttons have become common place on websites and blogs. When using these tools, Facebook and other services do their best to pick an image from your webpage to use as a thumbnail next to the link being posted. Sometimes the image that gets displayed next to the link is irrelevant or out of place with the content of the link you are posting.

Facebook lets you customize the image that gets used when links are shared from your website by simply putting some basic HTML in the of each webpage. You can do something as simple as using your company’s logo and including this in all pages being shared. Or, you could use the photo for each product in that particular product’s page so it shows up in Facebook when being shared.

Here’s the code:

<link rel="image_src" href="/images/my-logo.jpg" />

Simply put the above in the of the page and change “/images/my-logo.jpg” to the path of the image you want linked.

Keep in my mind the more relevant the photo is to the content that shows up in people’s Facebook profile, the more likely they will not only click through to the site but also continue towards other established goals on your website. Hence, it may be worth the development time to use different images unique to their pages instead of just the company logo throughout the site.

Leave a Reply

Your email address will not be published. Required fields are marked *