Have your Facebook ‘like’ buttons stopped working recently? I might have a solution for you…

Last week, you may have read about Facebook quietly upgrading the functionality of their ‘like’ button plugin. Liking used to post a story to your Facebook wall like this:

Now, a full newsfeed-worthy story is published:

We’re already seeing a huge increase in social referral traffic across the web so, along with the recent changes to Google’s search algorithm to show results already shared by friends, this change should continue to drive this trend.

So, what impact will this have…

On our Facebook Feeds?

Facebook’s ‘like’ button has been a fairly passive and non-invasive way for people to register approval for, and share, online content. Minimal effort and minimal output on Facebook profiles.

Could all the extra information being published have an effect on the amount people choosing to hit your ‘like’ button? Will our news feeds be full of links our friends have liked, pushing those embarrassing pictures from Friday night to the bottom of our social pile? I do hope not.

On our websites?

Keen to test out the new ‘like’ button*, I visited the beautiful world blog only to find that our ‘like’ buttons had mysteriously stopped working. A quick Internet search produced no solution, so in confusion, I turned to the Facebook Developers Like Plugin page.

*It is worth saying at this point, site owners do not need to update the coding for the button on your website. The change only affects what data is pulled from your site when publishing a link.

A new section on this page outlined the importance about Open Graph data, and how it plays a part in what is now posted as part of a ‘like’.

With a point in the right direction from Facebook’s URL Linter, our ‘like’ buttons had stopped working because our Open Graph Meta data was incomplete (see next section for explanation of Open Graph Meta data).

After adding the following line of code in the head of our website, the buttons started to function normally again.

<meta property="fb:admins" content="FACEBOOK ADMIN ID" />

What is Open Graph Data?

Essentially, it is a set of information that allows your website to be read by a social graph and is an addition to the Meta content you place in the head of your website. This data has been used in the past with the ‘share’ button and suddenly has a lot more meaning with the new ‘like’ button functionality due to the volume of people who ‘like’ instead of ‘share’.

What do I need to change on my site?

Ogp.me covers how to start using this data as well as the basics you should start including to take advantage of the Open Graph protocol. Below shows how various pieces of Open Graph Meta are used when publishing a story:

Open Graph Meta data also standardises what is pulled in to your website’s Facebook activity feed, and now looks much more satisfying! (See our activity feed on the right.)

Some of these Meta items can be dynamically created with PHP code that allows custom data for each post. For example, WordPress users could use the following:

<meta property="og:title" content="<?php the_title(); ?>" />
<meta property="og:url" content="<?php the_permalink(); ?>" />

After adding this content in the head of your website, it might take a couple of days for this content to be registered and show up in Facebook news feeds. What will be interesting to find out however, is whether having complete and accurate Open Graph data can increase click through rates for each story.

If you have any questions, feel free to tweet or email me and I’ll try to get back to you ASAP.

Until next time,

Ash

Tags: digital, Facebook, facebook like, Open Graph, social media, social media integration