SiteKickr Web Development

Facebook like image thumbnail

If you offer a facebook like button on your site, you may have noticed that Facebook chooses a random image from your site as the thumbnail for the item in the Facebook news feed.

This image can be controlled on your end. I've read blog posts which lead up to the solution, but don't take it home. If you add the Open Graph meta tag as follows:

<meta property="og:tag name" content="image url" />

You might be disappointed to find that Facebook still chooses a random image. In order for the above to work, you need to supplement it with 5 additional Open Graph meta tags. The are discussed in Facebook's developer documentation, under Open Graph Tags.

ColdFusion example:

<head>
...
<meta property="og:title" content="My Page Title" />
<meta property="og:type"
      content="<cfif CGI.SCRIPT_NAME eq "/index.cfm">website<cfelse>article</cfif>" />
<meta property="og:image" content="http://www.mysite.com/src/img/logo.png" />
<meta property="og:url" content="http://www.mysite.com/" />
<meta property="og:site_name" content="My Site Name" />
<meta property="fb:app_id" content="xxxxxxxxxxx" />
...
</head>