Tracking Facebook Shares on your website or application is a useful way of seeing how popular your articles are with your readers. In order to tracking Shares, you must used the Facebook JavaScript SDK to create the Share popup and then use a callback function to log the result. Use this tutorial to learn how to trigger a callback function to save the result of Shares. In my applications, I use a PHP script (Code Igniter) to save the result to a database.
Important Update:
This tutorial no longer works due to changes with Facebook. In particular, the Share Dialog no longer returns the post_id in the response, which means shares can no longer be tracked.
The example on JSBin still works, but you will notice that no response is received from Facebook when a post has been shared.
JavaScript Code:
Working Demo:
You can see a working example of the above code on jsbin. If you keep the Console tab open, you will see that the callback function will return the ID of the post, if successfully published on Facebook. This ID can be stored for tracking purposes, and you can make a Facebook API call to the ID (e.g. https://graph.facebook.com/{post_id}) to get more details about what was posted (you will need read_stream permission to do so).
The Response:
If the post is successfully shared on Facebook, the callback function will return a response like the following:
You may notice that the post_id contains the user’s Facebook ID (the 60506094 in the post_id is my Facebook User ID), which means you know who shared your post. You can make an API call using the user_id to find public information about the user.
If you have the read_stream permission for the user, making an API call with the post_id returned in the callback function will return something like the following:
Ajax Script (PHP):
For reference, the below is an example of the PHP script I’ve used in my Facebook applications to log any shares to a database.
The Result:
The share to the user’s timeline will look like any other. Here is what will appear on your timeline if you use the above code:
Hi Niraj,
Its a great tutorial. 🙂
I have 1 more requirement. Hope you can help me. I am able to share a photo from FB wall, if the photo already uploaded in internet and I have a link for this.
I am using android phonegap 2.9.0 and need to upload/share Images from Android SD card to Facebook wall through Phonegap/JS. Do you have any working example for that?
If yes then please help me.
Thanks,
Hi Niraj,
Do you have any idea about my query ?
Thanks,
Hi Rahul. I’m afraid I don’t have any sample code for this. I’m unfamiliar with PhoneGap, but will see what I can find.
The example is giving me an error.
It would really help me if you can indicate which part is giving an error, and what the error is.
Please note that the code isn’t designed to work completely. While the JavaScript code will work, the PHP code is only part complete – it needs to be adapted for your application.
I meant your demo was producing an error. It is working fine now.
it is not working for me
It is not working for me, console:
Uncaught SyntaxError: Unexpected token <
in http://getbootstrap.com/2.3.2/
It means you have an error in your code. Fix it first and then see if it works.
Hi,
This exactly what I need.. but your demo is giving me the error ‘Sorry this feature isn’t available right now, an error occured while processing this request, please try again later’
Any ideas?
Thanks so much
The demo does work, but only if you are not in the “Edit” mode.
Don’t worry! I tried it on my server and it worked PERFECTLY! Thank you so much! You’re a genius!
please tell me how i can achieve this by facebook share dialog instead of feed dialog.
i’m working on a project my client requirements only use open graph. i have tried a lot of article but it did not work please help me
This can only be achieved using the Feed Dialog offered by the JS SDK. You can look as hard as you want, but its not possible to do using using just OpenGraph tags on a page. If you are using Like buttons on the client’s site, you are already using the JavaScript SDK in some form.
Nirai Shah, it is not working for me too, mabe it’s very old.
Now, it is not facebook user id. I need facebook user id when they press share button. I got post_id: 1465280260425136_1465300913756404, but the first parameter is not facebook id
If your app was created after April 30th 2014, the first part of the post_id is the User ID specific to your application, and not the global Facebook ID. If the post_id is
10100439951266536_10100439952059946, then10100439951266536is the App Scoped User ID. You won’t be able to get the user’s real ID anymore.Hi Niraj,
This doesnt work for me. I’m embedding one of my FB posts from my fanpage on my website and then i want a button on the page that lets people share my fan page post, and as an incentive i give them a gift if they have shared.
I wanted to build a content locker based on your code. When i execute the code this is the error i get
‘API Error Code: 191
API Error Description: The specified URL is not owned by the application
Error Message: redirect_uri is not owned by the application.”
Arent you allowed to use facebook url’s?
Please advise
Thanks
The error is to do with your Facebook App Settings. You need to make sure the URLs are setup correctly.
Could you elaborate as to what settings you are referring to, so i can set that up correctly.
Are you referring to this?
http://screencast.com/t/WJbDShCwG
Thanks
Yes, you need to set the App Domains and add Website as a platform to the settings, with the URL to your website.
Thanks for your reply Niraj, but what I want is for people to share is my facebook fanpage post using a share button on my website. To do this i would need to put facebook.com as the app domain, which facebook wont let me do. i can use the old sharer.php ( which still isnt deprecated), but there is no callback available if i use sharer so I dont know if the person actually shared the post ( im trying to build a content locker, so people can access my premium content as an incentive, after they share my post) Anyway to accomplish that? Thanks
You don’t understand. The App Domain setting is so Facebook know where you’re running the script from – it’t not the URL you want to share. If you set the App Domain correctly, the JavaScript SDK will let you share anything you want. If anything is unclear, please check the Facebook Documentation or contact us for Paid support.
Got it working…thanks for your help 🙂
Hi , i own a Like Exchange website and i’m trying to implement your tutorial with no success , what i’m trying to achieve is getting callbacks for all kind of shares – photo/post/url , but i get successful callback for url’s only. Any idea of how to fix this?
Regards,
Majid
The script should work for any type of share, but it won’t distinguish between them. You’ll only need supply a few of the parameters for this to work, thought it seems that the Share Dialog is broken on Facebook’s side.
Could you please help me make this ork? I can pay. Thanks.
Sure. Please send me an email with your source code and any additional details and I’ll see if I can help you out.
Hi Niraj,
As per my client requirement, they have a facebook page, and who ever share the posts / events from that page should open a URL on the next tab of user and moved to home page with user details.
is this possible, I check different things and find a way to show the last post from fb page on the website home page and if any shares from there I could get the details easily but my client want from facebook page when shares open the client website.
Please help me.
Its unclear exactly what you’re asking, but you cannot track shares from a Facebook page. The code in this tutorial only works on websites or apps.
How can i get response using this script?
The response is returned in the function defined on line 8-16, and outputted to console using
console.log( response );.Your Code does not works when it is opened in private window
That would most likely be Facebook’s callback doesn’t work for private windows.
Niraj …Rameez here
Actually everything is working fine but i want that user should be only able to publish the post as public not only friends or only me…
Is there a way for that since im new to programming.
With Regards..
You cannot set the privacy of the post using JavaScript. This option is only available to the user at time of posting.
Hi nirij, can u please tell me what part of the code goes in which file. sorry but i am new to using fb share. Also, how can i share a post in the above code. How to add a point to the user if he/she shares a post and also reward a point if he/she likes a post.
Sorry, you are asking a complicated set of questions that would take hours to explain and understand. I suggest you try some tutorials and at least attempt some basic Facebook integration. You need a little understanding of how the API works.
Hello Niraj Shah,
Could you please help me to get return post_id .
we are using the same code but get null response .
we see many articles to get post_id and told that need to set the “publish_actions” but with the new version of api 3.2 we don’t have option for it.
So can you explain ,how we can get post_Id ?
The `publish_actions` permission has been deprecated so can no longer be used. However, if you’re using the Share Dialog, this permission is not required anyway. Facebook have stopped returning the `post_id` when sharing, so you can no longer track is the share was successful.