With the Open Graph Protocol, Any URL Can Be Treated Just Like a Facebook Page
We are here at f8, where Facebook has announced its vision for the “Open Graph,” as well as a new set of plugins (widgets) designed to write to and read from the Graph on any website. Facebook’s Mark Kinsey and Austin Haugen just explained in more detail how publishers, brands, and media companies can use the Open Graph together with the Like plugin and other plugins to get more distribution and engagement across Facebook.
Essentially, by using markup tags specified in the Open Graph protocol, any website can register itself as a unique object in the Facebook ecosystem. If a Facebook user visits your site Likes your page, you then have the ability to publish information into that user’s stream. In addition, you get an administration interface, and Insights metrics tools, just like those of any Facebook Page owner.
Implementation Options
You have the option to implement Facebook’s new Like button with either an XFBML tag or an iframe. The two are exactly the same, except that when you use the XFBML tag, users get the option to add a comment. If the user adds a comment, the action is published in the feed as a full story in the stream; if not, it’s published as a one-line story.
You can also choose how wide you want the widget to be. Facebook will automatically choose profile photo sizes based on what you specify, but you can also hide profile photos, or just show the “Like” button alone (not showing how many people have liked this page overall). There is also a dark version.
Finally, publishers can specify to change the language on the Like button to “Recommend” instead of “Like.” Facebook says this is intended to allow publishers the opportunity to avoid potentially awkward language when wanting to share some types of content with friends that they want to have a conversation about – for example, a news article on a devastating natural disaster.
How to Make Facebook Treat Your URL Just Like a Facebook Page
The most important part brands, business, and publishers should pay attention to is the new “Open Graph protocol.” Essentially, by adding a little bit of HTML markup to your page, you can enable Facebook to read structure metadata about your URL and treat it as a “permanent object” in the Facebook Graph.
This has 3 consequences:
1. You can now communicate with people who Like your URL just like Fan Page owners have historically been able to communicate with fans – publishing updates to their Facebook stream.
You have to go to a Facebook admin page to do this (that happens to look exactly the same as what a traditional Facebook fan Page provides), and there you’ll be able to publish updates to everyone who has liked your URL. You just specify who can see your admin page by adding one of the two following lines of code:
- To assign a list of users as page admins:
<meta property="fb:admins" value="USER_ID1,USER_ID2" /> - To assign this page to a Facebook app:
<meta property="fb:app_id" value="1234567" />
2. You also get all the traditional analytics tools Facebook has historically provided Fan Page owners. Facebook’s new “Insights for Your Domain” shows you the number of people who’ve liked your Page, daily active users (DAU), daily new users, etc.
3. When Facebook gets metadata about your URL (when someone likes it), it’s able to categorize it and put it in the right slot on a user’s “Info” tab on the profile, and generally display it in a more rich way whenever it shows up in the stream.
April 21st, 2010 at 3:10 pm
[...] With the Open Graph Protocol, Any URL Can Be Treated Just Like a Facebook Page [...]
April 21st, 2010 at 4:12 pm
What is the link at which these “admin pages” for LIKED websites appear? I haven’t found anything supporting this?
April 21st, 2010 at 4:13 pm
So when are you going to implement this on Inside Facebook?
April 21st, 2010 at 11:48 pm
[...] Weitere Details zum Open Graph Protocol bei Inside Facebook. [...]
April 22nd, 2010 at 2:21 pm
[...] With the Open Graph Protocol, Any URL Can Be Treated Just Like a Facebook Page (insidefacebook.com) [...]
April 22nd, 2010 at 5:35 pm
Is anyone coding the WP Plug-in already?!
April 23rd, 2010 at 1:40 am
I see people only liking URLs that they want to get updates on. And will updates arrive as email notifications?
April 23rd, 2010 at 5:03 am
[...] Graph - With the Open Graph Protocol, Any URL Can Be Treated Just Like a Facebook Page (Inside [...]
April 23rd, 2010 at 12:37 pm
Hi
What is the appID for facebook like button?
I tried to put the javascript sdk code for open graph to one of my sites but it seems error.
thx
April 23rd, 2010 at 4:40 pm
what is the downside of implementint the protocol from the perspective of sending info to FB. Also, what are the issues regarding putting the meta data in the header as opposed to the page?
April 23rd, 2010 at 8:42 pm
I love the concept but I don’t think that ‘liking’ a URL is an opt-in for updates by the domain owner to the average user. They just ‘like’ the content, much like they ‘dig’ something. As a result, people will think twice before liking something and might jeopardize the whole intent. Facebook should reconsider this. Updates to a users newsfeed should be limited to friends and fan pages.
April 24th, 2010 at 1:04 am
I’m lovin’ the OG Protocol despite what the early and late majority are saying. The only beef I have is with the og:image property which keeps re-posting the content image on the admin page. Finally had to remove it until I find a better fix.
April 24th, 2010 at 9:25 am
Hi,
I just added the “Like Button” to my site. I further added meta tags like ‘image’, ‘url’, ‘type’ etc. to each page.
Unfortunately, it seems that the “Like Button” treats all may pages as they are the home page i.e. it ignores the meta tags.
Any idea what I could be wrong in the why I implemented it?
Tx,
Sty
April 26th, 2010 at 6:04 am
[...] can also provide sites with additional reporting data. This Inside Facebook post has the details: With the Open Graph Protocol, Any URL Can Be Treated Just Like a Facebook Page Share this [...]
April 27th, 2010 at 6:21 am
[...] waa-aay easier, through what they’re calling their Open Graph, for us to access ‘the Book from wherever we are on the Net. Jeremiah Owyang, predictably, is the go-to chap for detail, but the bottom line is [...]
April 27th, 2010 at 1:15 pm
@Mike Knoop
You have to add the fb:admins meta tag in the header with your facebook user id and the link will show up next to the count of the like button
@Jose Augusto
Here’s the WordPress plugin:
http://wordpress.org/extend/plugins/like
April 29th, 2010 at 9:25 am
Hey all -
Has anyone had any luck using fb:app_id, og:type and og:url to connect a web page to a Facebook application ID, then put a Like Button on that web page?
I keep running into problems.
1) If I try to use fb:app_id AND use og:type and og:url, I get an error when I use the Like Button…
“You failed to provide a valid list of administators. You need to supply the administors using either a “fb:app_id” meta tag, or using a “fb:admins” meta tag to specify a comma-delimited list of Facebook users.”
2) If I try to use fb:app_id and do NOT use og:type and og:url, it seems to work correctly, but the Like counts are all over the place (none, 300+, etc). And, as best I can tell there’s no way to track it within my app on Facebook even though the docs claim that you can.
3) I tried using fb:admins with my userid. That worked, but I’d prefer not to manage them that way since I’ve got 100s of blog posts and don’t want to have that many individual pages in my Facebook account — nor do I want a public facing / crawlable Facebook page for every blog post.
You can see the page I’m starting with here… http://jamtopia.com/phishtwit (NOTE: Music auto plays) …which acts almost like a microsite (which is why I want to use og:type=website on that page).
If you view source you can see where I’m commenting out some of the meta tags so my users don’t see an error message.
In any case, I’m not sure if that was clear at all, but if anyone has any pointers it’d be much appreciated.
TL
April 30th, 2010 at 3:18 pm
How will this affect fan pages? Will we start seeing less and less interaction with fan pages and more and more interaction with the content itself? Does facebook realize this – is this what they want?
May 1st, 2010 at 6:35 pm
[...] More on Open Graph from Inside Facebook [...]
May 4th, 2010 at 9:33 am
[...] Zuckerbergs Keynote auf der f8, der jährlichen Entwicklerkonferenz von Facebook, hat gestern das Ganz Große Fass aufgemacht, der universale “like it”-Button kommt, jede Menge anderer Verknotungs- und Vernetzungsfeatures sowie das viel diskutierte Open Graph Protocol. [...]
May 16th, 2010 at 11:10 am
[...] no longer acceptable to dabble in Facebook or play around with social networking. You are now connected to your customers in ways that were impossible last [...]
May 19th, 2010 at 3:02 pm
[...] In short, Facebook plug-ins will allow you to turn any page on your site into a Facebook Page. [...]
June 4th, 2010 at 9:54 am
So, why no link to this page:
http://developers.facebook.com/docs/reference/plugins/like
Why is page generating iframe code that is leading to an ERROR after clicking:
Error message being:
“You may not use Facebook URLs with the Open Graph yet.”
Is anyone addressing this issue?
June 9th, 2010 at 1:55 am
Hello,
I have exactly the same problem as hwkd65 when I added this plugin in my webpage. Could someone please say, why is that problem?
Missing some meta tag’s or some mistakes in generating iframe, etc…
Thanks!!
June 9th, 2010 at 3:49 pm
same problem as hwkd65 and toyotasmile. error You may not use Facebook URLs with the Open Graph yet
June 10th, 2010 at 1:29 pm
Hi
Where can I find the fb:admins-metatag?
BG Kenneth
June 15th, 2010 at 9:00 am
Same problem as hwkd65 and toyotasmile and ian…
What is this Facebook is introducing motherfuker irritating steps….
And no one can help….
June 18th, 2010 at 3:02 am
I have the same problem as hwkd65. “You may not use Facebook URLs with the Open Graph yet.”
June 21st, 2010 at 5:54 am
It’s infuriating to plug in exactly the code that Facebook generates, and then get the message that I can’t use Graph, which i’m not even TRYING to use–I just want the simple Like button. Why has nobody responded to the multiple complaints about this???????????
You may not use Facebook URLs with the Open Graph yet
ARRRGGHHHHH
June 27th, 2010 at 1:00 pm
Great article. But there is little info on the internet for the right implementation. Does anybody have a Dutch manual or example?
July 10th, 2010 at 10:10 am
just add this meta tag
July 27th, 2010 at 12:39 am
[...] LIKE mygtuko funkcionalumas komentavimo funkcija. Anksčiau ji veikė tik su XFBML tagu, o šiuo metu galima naudoti ir vartotojams įprastą IFRAME [...]
November 11th, 2010 at 4:04 am
Yes, this is interesting. I look forward to learning more about this.
Thanks for sharing!
November 15th, 2010 at 8:54 pm
@Stylight, did you get answer to your question? Does anyone here know why the like button displays home page title rather than the target page title in the small like description.
Appreciate your answer.
November 28th, 2010 at 10:10 am
Hey, if you writing something, write correct values:
Not a
<meta property="fb:admins" value="” />
<meta property="fb:app_id" content="” />
Must be
<meta property="fb:admins" content="” />
<meta property="fb:app_id" content="” />
Atribute “content”, not “value”!
December 31st, 2010 at 9:36 am
[...] changes helped marketers, others seemed to be direct attacks against us. The introduction of the Open Graph Protocol and social plugins like the Like Button have, in only a few months, begun to reshape the face of [...]
February 22nd, 2011 at 2:18 pm
[...] Graph allows a content provider to, like Google Analytics, track his links’ likes and clicks on Facebook, even without having a Facebook presence. While this might seem like nothing new to your loss of [...]
August 16th, 2012 at 11:35 pm
[...] possibilities. Introduced in 2010, it enabled website owners to convert their web pages into Facebook equivalent pages simply by pasting specific Metadata on those pages along with a Like [...]