Contenu connexe Plus de Milan Steskal (6) 2. Introduction
Current Open Graph
connecting with "Like" button
Facebook pages
websites
ex: "Milan likes Coca Cola", "Milan likes a link"
New Open Graph
connect with what you want to and how you want to
ex: "Milan read Slovak Government Down on BBC”
3. Website application
Create an application
Authenticate user
Define action, object and aggregation
Publish actions
Submit actions for approval
4. Authenticate user
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId:'YOUR_APP_ID',
cookie:true,
status:true,
xfbml:true,
oauth:true
});
</script>
<fb:add-to-timeline></fb:add-to-timeline>
5. Authenticate user
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId:'YOUR_APP_ID',
cookie:true,
status:true,
xfbml:true,
oauth:true
});
</script>
<fb:add-to-timeline></fb:add-to-timeline>
6. Define actions and objects
action - describe what users do on the
website by one verb
object type - object involved in the action
7. Define an aggregation
Aggregates stories
actions on user's
timeline
data display (action)
layout style
sort by
title
caption lines
8. Publish actions
<head prefix="og: http://ogp.me/ns# APP_NAMESPACE:
http://ogp.me/ns/apps/APP_NAMESPACE#">
<meta property="fb:app_id" content="APP_ID" />
<meta property="og:type" content="APP_NAMESPACE:recipe" />
<meta property="og:title" content="Stuffed Cookies" />
<meta property="og:image" content="http://example.com/cookie.jpg" />
<meta property="og:description" content="The Turducken of Cookies" />
<meta property="og:url" content="http://example.com/cookie.html" />
<script type="text/javascript">
function postCook()
{
FB.api('/me/APP_NAMESPACE:cook' +
'?recipe=http://example.com/cookie.html','post',
function(response) {
if (!response || response.error) {
alert('Error occured');
} else {
alert('Post was successful! Action ID: ' + response.id);
}
});
}
</script>
</head>
9. Publish actions
<head prefix="og: http://ogp.me/ns# APP_NAMESPACE:
http://ogp.me/ns/apps/APP_NAMESPACE#">
<meta property="fb:app_id" content="APP_ID" />
<meta property="og:type" content="APP_NAMESPACE:recipe" />
<meta property="og:title" content="Stuffed Cookies" />
<meta property="og:image" content="http://example.com/cookie.jpg" />
<meta property="og:description" content="The Turducken of Cookies" />
<meta property="og:url" content="http://example.com/cookie.html" />
<script type="text/javascript">
function postCook()
{
FB.api('/me/APP_NAMESPACE:cook' +
'?recipe=http://example.com/cookie.html','post',
function(response) {
if (!response || response.error) {
alert('Error occured');
} else {
alert('Post was successful! Action ID: ' + response.id);
}
});
}
</script>
</head>
10. Demo
http://blog.mist.sk
