This is my second tutorial of Facebook application development with Open Graph series, in previous tutorial I showed you how to setup your Facebook application with Open Graph. Now in this tutorial I will teach you to how to publish actions on user’s timeline.
Note: Due to changes announced by Facebook on 31st May this tutorial has been updated you can visit the updated tutorial from here.
How to Publish Actions on User’s Timeline
If you have already created actions and objects by following my previous tutorial then the next setup is to publish those actions on user’s timeline, but before proceeding you can check my demo app.
Step 1: Go to developers.facebook.com/apps select the relevant app if you have multiple apps and click on Edit open Graph in Open Graph section.
Step 2: Click on Get Code in Object Types and copy the highlighted code from popup window and save it somewhere.
Step 3: Click on Get Code in Action Types and copy access token as shown in the second image and save it also.
Step 4: Now create a file test.html, paste the following code in it, replace the colored text according to your app's settings and upload it to your hosting server yoursite.com/test.html.
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US"
xmlns:fb="https://www.facebook.com/2008/fbml">
Paste the code copied in step 2 here and don't forget to replace Put Your Own URL Here with yoursite.com/test.html in og:url, set descriptions and image according to you page content.
<script type="text/javascript">
function read()
{
FB.api('/me/Your_Namespace:action' +
'?object=Yoursite.com/test.html&access_token=Paste the access token copied in step 3','post',
function(response) {
var msg = 'Error occured';
if (!response || response.error) {
if (response.error) {
msg += "\n\nType: "+response.error.type+"\n\nMessage: "+response.error.message;
}
alert(msg);
}
else {
alert('Post was successful! Action ID: ' + response.id);
}
});
}
</script>
</head>
<body>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId:'Your_appId', cookie:true,
status:true, xfbml:true, oauth:true
});
</script>
<form>
<input type="button" value="Post To Your Timeline " onclick="read()" />
</form>
</body>
</html>
Your_Namespce: In my demo app it was onlytipsandtricks change it according to your app.
Action: In demo app it was read but when you click on get code as you did in step 3 you will see underscore after read as read_
You have to include these underscores in both actions and objects otherwise you will get the following error:
The action you're trying to publish is invalid because it does not specify any reference objects. At least one of the following properties must be specified: article_.
Object: We used object article in demo app so you have to replace it according to object settings of your app.
Your_appId: You application id.
Finally you can test your page by visiting yoursite.com/test.html and clicking on Post To Your Timeline button, if all things go well you will see Post was successful! message along with app id on your page.
When I click "Publish to Timeline" button I get an error "session is expaired".
ReplyDeleteYou need to add the demo app before publishing to timeline.
ReplyDeletewhen I click on "publish to timeline", nothing happens! :( Help soon if possible
ReplyDeleteThe action you’re trying to publish is invalid because it does not specify any reference objects. At least one of the following properties must be specified: article_.
ReplyDeleteI am getting the above error as per your doc. i have made chages but not working plz tell wat i do for it .
Have you added underscore "_" after "article_" in this line FB.api('/me/Your_Namespace:read_' +
ReplyDelete'?article_=Yoursite.com/test.html&access_token=Paste the access token copied in step 3','post',
yes I did but now give me below error
ReplyDeleteMessage: (#3502) Object at URL http://fanmeter1.spanatix.com/Timeline-2/test.html has og:type of 'website'. The property 'movie_' requires an object of og:type 'fmtimelinedemo:movie_'.
I have checked your page on Debugger its ok, if you added the same objects and actions types in your app and still you are getting this error then may be its a Facebook bug many people are complaining this, here is same question from stackoverflow although its related to submitting the object.
ReplyDeleteHello!i loved ur article and want to know is it possible that when any person visit my blog and read any article ,when he reads it get posted on facebook that That person has read an article..like today big sites have this feature.please help/
ReplyDeleteYes its possible but first thing you need is the user visiting your site for reading articles must authenticate your app before read action can be posted to his timeline, you can use "add to timeline plugin" for this purpose. The other thing is your pages must have open graph meta tags matching with your app's actions and objects, if you have self hosted wordpress blog there are few plugins with can add meta tags to your pages.
ReplyDeleteBut i am using blogger and it`s really difficult to start that service.Can You write a tutorial for enabling that sevice for a blog.My blog is paisaearn.in
ReplyDeletei got an error that unknown path components/mynamespace:read_
ReplyDeleteI keep getting this:
ReplyDeleteMessage: The action you're trying to publish is invalid because it does not specify any reference objects. At least one of the following properties must be specified: article.
I've followed this article down to the last full stop but no luck.
Any ideas?
TIA
Ok - I clearly didn't see everything! Brilliant - thanks.
ReplyDeleteSomeone did mention a good example of something I'm look to do
1) If app not authenticated
1.1) Show "Add to Timeline" or "Authenticate this App" button
2) If app is authenticated
2.1) Run the function to add the "read an article" to the timeline
2.2) If they come back to the page, check if the actio has already been submitted
2.3) If submitted already i.e. already seen article, don't add again
1. You can add the "Add to timeline" plugin, by using this plugin if the user is not authenticated he will be shown "Add to timeline button" and if the user already added the app then "added to timeline" will be shown.
ReplyDelete2. If user is authenticated with publish_actions permission then you can publish "read" actions by allowing user to click on the custom button as we did in the example or you can call javascript function by using this bit of codeonload="read() so that when the user clicks on link to article the action will be posted automatically when the page will be loaded.
HI !
ReplyDeleteI've followed your tutorial step by step and it's still not working...
I've got my app on my application page and i see
Add to timeline when i click on it nothing happenned to my timeline :(
I have also a message error which is
Message(#3502) Object at URl "my URL" has og:type of'website'
The property 'article' requires an object of og:type 'testserd:article'
**testserd is my app namespace
Do you know how to fix this?
It Works now ive solved out :) Thanks Nice Tuto and excellent job <3 it
ReplyDeleteHow did you solve this issue? I have run into the same problem.
ReplyDeletereally timeline is more crapy i really like the old facebook profile ...
ReplyDeleteYeah, I have the same problem. What did you do to fix?
ReplyDeleteyour app is not working anymore. do you know why?
ReplyDeleteWhich type of error you have faced?
ReplyDeleteThanks, great articles and helped heaps.
ReplyDeletethis tutorial save my time a lot . thanks...
ReplyDeleteIts not working and on click button nothing happens.
ReplyDeletePlease Help
Its not working here too.
ReplyDeletePlease Guide
Does it shows any error message?
ReplyDeleteNo... Its not showing any error on "Post to your timeline" button click.
ReplyDeleteYes... Now it is showing error....
ReplyDeleteThe action you’re trying to publish is invalid because it does not specify any reference objects. At least one of the following properties must be specified: article.
I am getting this in Action type
ReplyDeleteFB.api('me/news.reads' .......
Instead of
FB.api(‘/me/Your_Namespace:action....
Semicolon is missing ???
Erro code(#100) Can only call this method on valid test users for your app"
ReplyDeletebut after sometime
error: session has expired at unix time......
What is this?? plz help me out
“Session expired” means the access token has expired the token usually expires within two hours, now you have to copy the the token again as mentioned in step 3.
ReplyDeletei tried everything but nope, nothing happens when i click "post to my timeline". why do you think i am even not getting an error message? thanks in advance
ReplyDeleteFirst make sure that all the code is in plain text, if you have copied the code from here then chances are that you have copied the formatted text and you have to convert it into plain text, if the code you have copied is already in plain text then check if you have correctly loaded the SDK and additionally you can check the source code of my app.
ReplyDeleteI've toiled at this too, and have finally got it to show the 'Post To Timeline' button ( albeit amongst strange symbols) but alas nothing happens ..... http://www.itsousideinside.com/test.html
ReplyDeleteAny thoughts?
I am out of thoughts because the link you have posted is not working anyways i guess it is itsoutsideinside.com, i have checked your pages source code its showing strange characters.
ReplyDeleteI followed the example above but i keep receiving tha same erron when i click in "publish" button:
ReplyDeleteMessage: (#15) This method must be called with an app access token.
any ideia?
Unknown Object Type: Object at URL 'http://samples.ogp.me/431410613536548' is invalid because the configured 'og:type' of '430460170298259:group' is invalid.
ReplyDeleteNo Matter what I do, I keep getting this error message when I debug sample data. Any ideas?
Thanks
Julie
I have the same problem others mentioned. Message (#3502) Object at url...has og:type of 'website'. The property 'article' requires an object of og:type 'article'.
ReplyDeleteHere is the link to the article http://fb.idebate.eu/article2.php.
Thanks for writing this tutorial, it's been great help.
You should check your URL in debugger and if it shows no error and og tags are same as of your app then may be its a bug.
ReplyDeleteThe debugger indeed showed no errors, but in fact there was an error in the API call wich I fixed, everything is working now. The only problem I still have is that the access token copied and pasted in "step 4" expires after 2 hours and I need to request a fresh read code, and paste the new token. Any way to do this automatically, or to make tokens not expire?
ReplyDeleteNevermind, I just found your article here http://onlytipsandtricks.com/facebook/how-to-get-access-token-for-publishing-action-on-timeline/ thanks for all the help and sorry for the spam.
ReplyDeleteThanks for share this tutorial.
ReplyDeleteall is work!
great tutorial...thx
Hello Hasnain:
ReplyDeleteI want exactly what Akansh described.
I am already using a plugin for OGP meta tags that is doing its job very well. But I can not find an "Add to timeline plugin". Would you point me in the right direction? Thanks a lot.
Boss I'm getting a Window saying,
ReplyDeleteError occurred
Type: OAuthException
Message: An active token must be used to query information about the current user.
==>>> Breaking head since noon, Would be helpful if u reply within tomorrow noon, Pleaseee
hi hassin,
ReplyDeletei've read the article carefully. there is no underscore in the code which i got from step 3. so i did not put in the code. i still get error like:
Error occured
Type: Exception
Message: The action you're trying to publish is invalid because it does not specify any reference objects. At least one of the following properties must be specified: cusine.
I got the post to your timeline button but nothing happens as a lot of people have already said.
ReplyDeletehttp://www.idpturkey.net/test.html
There seems to be some error with documentation and the fb.api. After playing around with the code I got it to work. Please view my same code here: nopenonlytext.tnguyen.com/test.html
ReplyDeletenote that my fb.api call has been modified to:
FB.api(
'/me/Publish',
'post',
{ article: 'http://nopenonlytext.tnguyen.com/test.html' },
Publish is the Action Type
article is the object.
[...] There are additional instructions here that helped me. http://onlytipsandtricks.com/facebook/how-to-publish-actions-on-timeline/ [...]
ReplyDeletesame here!
ReplyDeleteYou must change the ´ to '.
ReplyDeleteAnd Its run ;)
nice tutorial :)
ReplyDeleteMany thanks for this article. It's a pity that you can't create the working app that show the working code.
ReplyDelete