Posted by If you have a ‘like’ button on your website, you can control most of what gets displayed on the wall of the user who ‘liked’ the site. The two most common things that one would want to control are the title and the image. You can control these with a set of meta-tags that you place in the <head></head> of your site.
An example of these is as follows:
<meta property="og:type" content="article"/>
<meta property="og:url" content="https://phil.lavin.me.uk/2012/01/controlling-the-image-and-title-displayed-on-facebook-for-a-like/"/>
<meta property="og:image" content="https://phil.lavin.me.uk/wp-content/uploads/2012/01/facebook-logo.png"/>
<meta property="og:locale" content="en_GB" />
<meta property="fb:admins" content="p.lavin"/>
It should all be self explanatory, except for ob:type. You can find a type that suits your content on Facebook’s type list.
Once you have put these tags on your site, you can check the tags validate by running a link to your site through the Facebook Debugger. Running a page through this tool also has the advantage that it clears the page from Facebook’s cache. This is useful if you tried to like the page before you added these tags and the previous title and image have been cached by Facebook.
You can see it in action if you ‘like’ this article using the button below. You will see the article’s thumbnail is pulled across to Facebook.
That will come in handy at work. Thanks!
Lazy bugger. =P