Making your Facebook shares better/prettier

If your running a website and actively encourage users to share ccntent across facebook, it may be a good idea to control what way its being shared. Facebook includes graph meta tags which allow you to default to a certain image for the post on facebook and what title.

Add these tags between the <head> tags on your page

1
2
3
4
<meta property="og:type" content="blog" />
<meta property="og:url" content="http://blog.yrecruit.com/2011/03/the-state-of-online-recruitment-websites-in-ireland/" />
<meta property="og:site_name" content="Yrecruit Blog" />
<meta property="og:image" content="http://yrecruit.com/imgs/yrecruit_share.png"/>

This is the content for the tags on one of my new sites which enables a logo to be displayed along with the title, if i didnt have that tag included, the logo would not be displayed at all.

Now my post looks like this without the logo

Having added in the tags now i get a pretty branded logo included with my blog post

Plugins for wordpress

Manually putting this on every page would be tedious and time consuming, luckily i use wordpress to power my blogs and it comes with a handy tool to include the tags.

The plugin i use is listed below-
Open Graph
Add Open Graph metadata to your pages.

I added in my own image tag to the header file of my theme and made sure the image worked with the posts

For more info

Check out the page on facebook.com about sharing content

Leave a comment

blog comments powered by Disqus