Sharing on Facebook using JavaScript


In this post we will see how can integrate our application with Facebook. We will look into how a status, picture or video can be shared on Facebook wall using JavaScript.

Expected output is as following


Register Application to Facebook

Very first we need to register our app on Facebook. We can register that by navigating on following link.

Select option of Create New App. Provide App Name and App Namespace. We need to provide unique App name and App Namespace.


After that, we need to complete Security Check.


Once Application has been successfully registered, you will get App ID and App Secret ID as following,


Once we got the App ID and App Secret ID, we need to provide information about site or mobile web from where we are going to share on Facebook. There are two important points very important here.

  1. App Domains
  2. Site URL and Mobile Web URL

Since I am going to do this sample on local server, hence I have set AppDomains as localhost and Web Page URL or Mobile Web URL will be http://localhost:1461/ . So I have configured that as following. Make sure you configure your App Domains and Site URL/Mobile URL as of your application. For example if your site domain is XYZ then give App Domains as XYZ and Site URL http://XYZ/yourpage


As of now we have registered and configured application on Facebook. Next we need to write JavaScript code to share on Facebook.

Code to Share on Facebook

Let us put a button on page. On clicking of this button we will share status on Facebook.


Very first we need to initialize page for Facebook integration. Put following code just before closing <body> tag. Do not forget to replace Your App Id with your real app Id.


Now we need to add reference of following JavaScript file. Add these references in Head section of HTML.


Once all references being added we need to write code on click event of button to share something on Facebook. We can share Video, Status, and Picture. FB.ui function will be used to share. Different parameters of this function is explained as following


Now we can share status as following,


If you are not logged in to Facebook then you get prompted to login and then share as following,




In this way we can share status on the Facebook using JavaScript. Combining all the codes together as following

Share on Facebook
<script src="">
<script src="">
<script type="text/javascript">
 $(document).ready(function () {
 $('#shareonfacebook').click(function (e) {
 method: 'feed',
 name: 'DebugmodeEventPlans',
 link: 'http://localhost:1461/ShareonFB.html',
 caption: 'hey how is my Application ? tell me dude',
 description: 'hey how is my Application ?',
 message: ''
<button id="shareonfacebook" >ShareOnFaceBook</button>

appId : 'urappid'

If you want to share a Video you can share it by giving Source vale and Picture values as following.


In this way we can share status on Facebook from JavaScript. I hope this post is useful. Thanks for reading.

15 thoughts on “Sharing on Facebook using JavaScript

  1. Pingback: Dew Drop – June 25, 2012 (#1,350) | Alvin Ashcraft's Morning Dew

  2. Pingback: My Homepage

  3. Pingback: Lidya

  4. Pingback: Sharing on Facebook using JavaScript | Gerda's Collection

  5. hi sir, i want to post image on my wall not its link how can achieve?…..i have used your above code and only link of image is posting not image directly please help me….

  6. I think its great assignment for me
    All are good ….
    Can you tell me sir how to generate API-ID


    appID:”Your API ID” // This portion i didn’t understand


  7. this is possible for multiple users or not ?
    My code is working for only single user i want to use for multiple user what can i do …

    (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) {return;}
    js = d.createElement(s); = id;
    js.src = “//″;
    fjs.parentNode.insertBefore(js, fjs);
    }(document, ‘script’, ‘facebook-jssdk’));

    $(document).ready(function ()

    $(‘#share’).click(function (e)


    method: ‘feed’,
    name: ‘first’,
    link: ‘’,
    caption: ‘hey how is my Application ? tell me dude’,
    description: ‘hey how is my Application ?’,
    message: ”

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s