FaceBook has launched a new tool to enhance its social network. Open Graph is a protocol for representing subjects (such as books, websites, films, restaurants, celebrities) as searchable Facebook pages.
Imagine that you own a personal website. For marketing purposes, you wish to add a FaceBook 'LIKE' button to your website. In addition, you would like FaceBook to 'know' about your website and for it to show up in other user's profiles. This is where Open Graph comes in. In order for FaceBook to use your website as a FaceBook object (page), you will need to define the markup/schema, META tags, and include a 'LIKE' button.
In the <html> tag, you will need to add the Facebook and Open Graph schema:
<html xmlns:og="http://opengraphprotocol.org/schema/"
xmlns:fb="http://www.facebook.com/2008/fbml">Next, you will create your Open Graph META tags within your <head> tag:
<meta property="og:title" content="Personal Website"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="http://URL"/>
<meta property="og:image" content="http://URL/image.gif"/>
<meta property="og:site_name" content="personal"/>
<meta property="fb:admins" content="USER_ID"/>
<meta property="og:description" content="A description goes here."/>Thirdly, you will need to create your 'LIKE' button; I've used both the IFRAME and the XFBML versions. (The XFBML version offers more control.) The FaceBook Developer website has a tool that creates the code for the IFRAME version of the 'LIKE' button for you.
That's all there is to it. Simple. However...I have racked my brains this weekend on a particular issue; it's the first development piece of work that I have done using the Open Graph API. Upon creation of all the elements mentioned above and looking through numerous examples and the developer forums, I came to the conclusion that this feature in FaceBook is 'broken'. Facebook never created the 'object'/page for my entry; my entry was never added to the Open Graph. (I understand that this could take a few hours to happen as FaceBook needs to scan the tags on the pages.)
When the Open Graph is used and the 'LIKE' button is clicked (by the profile listed in the META 'Admin' tag), this profile should create a FaceBook page as an 'object' which can then be tracked in your Facebook profile under 'My Pages'. The 'object' is also meant to be added to your profile's 'Likes and Interests' section in the 'Info' tab. This did not happen. The 'LIKE' button can be clicked and added to my profile's wall with an optional comment, but that is it.
My next test relied on using an existing URL in my 'LIKE' button's IFRAME code that already has a FaceBook object associated with it. Whereas I obviously would not see the page in 'My Pages' (as I am not an administrator), I did note that the item appeared in my profile 'Likes and Interests' section in my profile. But, as soon as I swapped the URL in the IFRAME for my website's domain name, the URL was not happening. The existing URL worked because an OpenGraph object had already been created.
I also completed another test to ensure that my META tags are correct. FaceBook's own URL Linter has been down for a while, but I came across this: http://ogit.heroku.com/, and this does the same checks.
It is a little disappointing that FaceBook seems to be neglecting its development tools, which some companies do want to use for marketing their businesses. Let's hope FaceBook fixes the issues soon so we can continue developing.
Leave a comment