It’s been a long time I read about the open graph protocol
Basically:
“The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to enable any web page to have the same functionality as a Facebook Page.
While many different technologies and schemas exist and could be combined together, there isn’t a single technology which provides enough information to richly represent any web page within the social graph.
The Open Graph protocol builds on these existing technologies and gives developers one thing to implement. Developer simplicity is a key goal of the Open Graph protocol which has informed many of the technical design decisions.”
(from http://ogp.me)
It is very easy to implement and to understand.
It sits in the html code of your page and provides information which can be grabbed b Facebook.
When does it grab it?
When people post a link of your page or when you put the famous like button on the page and someone clicks on it…
A lot of people are afraid of facebook (and are saying that continuously on… facebook), a lot of media are afraid too.
Let’s be clear: you want to be public? you want to show something? you want to make contact quickly and precisely in your entertainment group but all over the planet ? If the answer is yes, Facebook is the tool. A lot of people know this.
What do you need to put inside your page code?
Facebook provided something more focused on their network here:http://developers.fa…/docs/opengraph
Basically, you have to put some meta tags ; some are always required, some others are options.
A tag is like that:
[color-box]
<meta property=”[TAG_NAME]” content=”[VALUE]”/>
[/color-box]
Those [TAG_NAME] required are:
[color-box]
– og:title – [VALUE] is the title of your object as it should appear within the graph.
[/color-box]
[color-box]
– og:type – [VALUE] is the type of your object. (check at the end of the post)
[/color-box]
[color-box]
– og:image – [VALUE] is an image URL which should represent your object within the graph. The image must be at least 50px by 50px and have a maximum aspect ratio of 3:1. We support PNG, JPEG and GIF formats. You may include multiple og:image tags to associate multiple images with your page.
[/color-box]
[color-box]
– og:url – [VALUE] is the canonical URL of your object that will be used as its permanent ID in the graph.
[/color-box]
In addition:
[color-box]
– og:site_name – A human-readable name for your site.
[color-button href=””]
[color-box]
– fb:admins or fb:app_id – [VALUE] is a comma-separated list of either Facebook user IDs or a Facebook Platform application ID that administers this page. It is valid to include both fb:admins and fb:app_id on your page.
[/color-box]
It’s also recommended that you include the following property as well as these multi-part properties.
[color-box]
– og:description – [VALUE] is a one to two sentence description of your page.
[/color-box]
Other tags can be added and it is better to put them in the code.
It will make the considered page better indexed by the system.
About Location:
[color-box]
[/left][left]<meta property="og:latitude" content="37.416343"/> <meta property="og:longitude" content="-122.153013"/> <meta property="og:street-address" content="1601 S California Ave"/> <meta property="og:locality" content="Palo Alto"/> <meta property="og:region" content="CA"/> <meta property="og:postal-code" content="94304"/> <meta property="og:country-name" content="USA"/>[/left][left][/color-box]
About Contact Information:
[color-box]
[/left][left]<meta property="og:email" content="[email protected]"/> <meta property="og:phone_number" content="650-123-4567"/> <meta property="og:fax_number" content="+1-415-123-4567"/>[/left][left]
[/color-box]Attaching Audio and Video Data:
[color-box]
[/left][left]<meta property="og:video" content="http://example.com/awesome.flv" /> <meta property="og:video:height" content="640" /> <meta property="og:video:width" content="385" /> <meta property="og:video:type" content="application/x-shockwave-flash" />[/left][left][/color-box]
Among the required tags, there is one called type
There are some frequent content/value available, but apparently, you can use anything.
Those frequent are:
Activities
– activity
– sport
Businesses
– bar
– company
– cafe
– hotel
– restaurant
Groups
– cause
– sports_league
– sports_team
Organizations
– band
– government
– non_profit
– school
– university
People
– actor
– athlete
– author
– director
– musician
– politician
– public_figure
Places
– city
– country
– landmark
– state_province
Products and Entertainment
– album
– book
– drink
– food
– game
– product
– song
– movie
– tv_show
For products which have a UPC code or ISBN number, you can specify them using the og:upc and og:isbn properties. These properties help uniquely identify products.
Websites
– blog
– website
– article
Once you complete the code, You can even test how facebook see’s it by going to : http://developers.fa…com/tools/lint/
You can create all those tags.
Imagine you want Facebook to grab ALL the pages of your websites differently, in order to be more precise & make an efficient indexation.
You can put in the URL on each page the current URL of the page seen.
You can create a php code that populates the description with this or that information (tags of a post in wordpress for instance)
But the most important thing is to provide the like button.
When a person clicks, the url is sent to Facebook for grabbing. And Facebook grabs all the meta data we discussed here. AND, this link is posted on the news feed of the clicker.
This like button is easy to build with the online builder here
Now, have fun !
