Contact Us
  • Tutorial: Create a Facebook Share Button to your iFrame Tab Application

    If you’re NOT on the HyperArts Blog, CLICK HERE!

    NOTE: Updated 12/7/11 to change JavaScript SDK script to ansynchronous, and various modifications and additions.

    As Facebook continues to encourage the move towards iFrame applications rather than FBML ones, one thing that Page Admins have asked about is the ability to have a “Share” button on their Fan Page that allows the user to add a comment and then post a pre-defined text block, image, and link to the Wall and News Feed of friends. In FBML, this was accomplished using the <fb:share-button> tag, but this ability is missing from the Social Plugins that Facebook provides for use on external websites and in iFrame applications.

    Replicating the Old Share Button Code with JavaScript SDK & jQuery

    In this tutorial, we will look at how to use the Facebook Javascript SDK and some jQuery to mimic the old <fb:share-button> function within iFrame-powered applications that appear on a Fan Page. If you are not familiar with creating an iFrame application, you will want to refer to our tutorial on creating an iFrame tab application first.

    NOTE: A basic understanding of JavaScript is required

    This tutorial will require that you have at least a basic understanding of JavaScript. If you don’t, you may have difficulty working with the code in this tutorial.

    STEP 1: Add code to load the Facebook JavaScript SDK into your HTML/PHP index file

    IMPORTANT: In order for this to work with Internet Explorer, you MUST include the <html> </html> and <body> </body> tags in your index page.

    First, add to your application index file (usually called index.html or index.php) some code that loads the Facebook JavaScript SDK (between the <body> </body> tags):

    <div id="fb-root"></div>
    <script>
    window.fbAsyncInit = function() {
    FB.init({
    appId : 'YOUR APP ID',
    status : true, // check login status
    cookie : true, // enable cookies to allow the server to access the session
    xfbml : true // parse XFBML
    });
    };
     
    (function() {
    var e = document.createElement('script');
    e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
    e.async = true;
    document.getElementById('fb-root').appendChild(e);
    }());
    </script>

    NOTE: You will need to replace the 'YOUR APP ID' with your actual application ID, which you can find on your application page at facebook.com/developers.

    STEP 2: Add code to load the jQuery Library to your App

    Next, you need your app to load jQuery, which is a JavaScript library that simplifies many JavaScript-related tasks. You could also use basic JavaScript, or another library such a MooTools, but that is beyond the scope of this tutorial.

    I like to load the jQuery library from Google as it loads quickly and many people will already have it cached in their browser history.

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

    STEP 3: Add some jQuery and fb.ui code to display the Share dialog box

    Now that we have the Facebook JavaScript SDK and jQuery loaded, we are ready to define the Share popup dialog using some jQuery and the Facebook function fb.ui. Insert this code into your file:

    <script type="text/javascript">
    $(document).ready(function(){
    $('#share_button').live('click', function(e){
    e.preventDefault();
    FB.ui(
    {
    method: 'feed',
    name: 'HyperArts Blog',
    link: 'http://hyperarts.com/blog',
    picture: 'http://www.hyperarts.com/_img/TabPress-LOGO-Home.png',
    caption: 'I love HyperArts tutorials',
    description: 'The HyperArts Blog provides tutorials for all things Facebook',
    message: ''
    });
    });
    });
    </script>

    This code tells jQuery to attach a Share dialog to the DIV in your code with the ID of "share_button". You can insert multiple share buttons on a page by repeating this code, making sure you use a unique ID for each (eg #share_button1, #share_button2).

    This code will create this dialog:

    You can customize the text and image in the Share dialog and post by changing these values:

    • Name: This is the text that appears on the first line of the Share and is hyperlinked to your link;
    • Link: This is the hyperlink that you want to share;
    • Picture: This is the URL of the image that you want displayed along with the post on the Wall/News Feed. I used an image that 70 x 70 in this example, but Facebook appears to allow some flexibility around image size that you are sharing. Just make sure you test out what you image ends up looking like on the feed.
    • Caption: This is the first line of text after the Name/Link;
    • Description: This is the text that appears under the caption. Use it to provide incentive for why users should click on it.
    • Message: This field allows you to pre-populate the message box at the top of the dialog. Facebook normally does not recommend that you pre-populate that field since they want the user to enter a personalized message.

    STEP 4: Create a link/button to trigger the dialog

    You can launch the the Share dialog using any link or button. In our case, we created a graphic that looks like the classic "Share" button:

    Just insert the link/image in your index file and add the ID "share_button"

    <img src = "share_button.png" id = "share_button">

    When the user clicks on that button, it will cause the Facebook dialog to be displayed.

    Once the user fills in their message and clicks the "Publish" button, the post will appear on their Wall and may appear in their friends' News Feeds (depending on their settings).

    STEP 5: Control the Cursor Style with CSS

    Control Share Button Cursor with CSSTo add a custom cursor to the Share Button with CSS:

     

    • Add this style to your stylesheet:

      img#share_button {cursor: pointer;}

    • Or inline the style on the page:

      <style type="text/css"> img#share_button {cursor: pointer;} </style>

    Adding Multiple Share Buttons to a Single Tab

    You can do this by replicating the <img /> tag, changing the

    id = "share_button"

    to

    id = "share_button2"

    And replicating the JavaScript just below it, changing:

    $('#share_button')

    to

    $('#share_button2')

    If you're also implementing the CSS to control the appearance of the cursor (as described above, in Step 5), you need to change:

    <style type="text/css"> img#share_button {cursor: pointer;} </style>

    to

    <style type="text/css"> img#share_button, img#share_button2 {cursor: pointer;} </style>

    Obviously, modify IDs for each additional Share Button!

    View a live example of our Share Button

    You can see an example of this code in action on the HyperArts Examples page. It has two share buttons.

    Downloading the code

    You can also download the code we used to get you started. Just make sure to update the APP ID, text, and images as needed.

    Troubleshooting the Share Button

    API Error Code: 191 Popup Dialog

    If you get the "API Error Code: 191" popup dialog error:
    Facebook API Error Code 191 - Dialog Popup

    when using an embedded Share Button or other feature that requires the Facebook JavaScript SDK, it's may be because you haven't specified the "App on Facebook" URLs. Read this for more details.

    Please post your questions in the comments section below. Happy coding!

    Comments

    1. Hello,

      Thanks for the most needed updates :)

      I was trying to download the code, but could not as i was for username and password! Please advise on this.
      Thanks

    2. Savannah says:

      Wouldn’t it be easier to just use share.php and send it an encoded URL? Here’s what I use on my pages (I use the easy encoder/decoder at http://meyerweb.com/eric/tools/dencoder/):

      < < Code removed due to display issue >>

    3. Okay, I think that’s getting me closer, but now it’s giving me this in the error window:

      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.

    4. Does the script require “publish_stream” permission?

      • Hi Vin,

        No, the script doesn’t require any permissions from the user since it doesn’t publish anything unless they click the Publish button. “publish_stream” is only needed if you are publishing an item to the Wall/News Feed without explicit permission from the user at the time of publishing.

        Bill

    5. Thanks for the post! One question…I ran something similar on a new application page, and tab. The share got a lot of use and it was blocked from sharing by Facebook. Any ideas on this? Would your javascript share run into the same problem with high traffic on a new application/tab?

      Thank you!

      • Hi Ryan,

        You would probably run into similar limit issues with this script since it just calls the official Share function built into Facebook. Out of curiously, how many “Shares” were done that caused you to be blocked?

        Bill

    6. Vim Lim: As I mentioned, public_steam permission isn’t needed. You can see it working on our example page without that permission. I have seen that error when the JS SDK is loaded more than once, or in the wrong order. One thing that you might try is loading the SDK asynchronously rather than the way that I indicated in this article. Just look for that section with that title in the Facebook developer docs.

    7. Hi Bill,

      Thanks a lot. I got it working at fb.com/qyzzy

      Thanks again. You have been great help!

    8. Thanks Hyperarts, great blog

      I am getting the error:

      “Invalid Argument
      Given URL is not allowed by the Application configuration.”

      My App ID is correct and so are the URLs but it still throws this error in all browsers. Any ideas?

      • Hi Peter,

        I have that seen that error before, and I seem to recall it had something to do with the Canvas app settings when I set up the FB app, so you might want to double-check those to make sure that page you are loading matches those settings.

        Bill

    9. Hi Bill,

      I’m using this in a different way, not as a button on a fan page but as a button on my blog that will be link to the fan page.

      It is working great but, is there a way to make the share point to a particular a fan page on facebook?

      thanks.

    10. Plz someone help me
      How to Specifiy a different stylesheet for iFrame on Facebook,how can one make Facebook use a specific CSS file when it shows content through the iframe.

      I want to apply a specific stylesheet for the content of an external wordpress site when it is shown in an iframe on Facebook.. When visited directly, the page would call the regular CSS. When seen through the iframe, it would call a facebook-specific CSS.

    11. Hi, I have been looking all over to try to figure this out, thanks for the post! I’m having some trouble getting it to work, and I’m sure it is because I’m using like-gating. My index.php code looks like this:
      <?php

      require 'facebook.php';
      $app_id = "APP ID HERE";
      $app_secret = "APP SECRET HERE";
      $facebook = new Facebook(array(
      'appId' => $app_id,
      'secret' => $app_secret,
      'cookie' => true
      ));

      $signed_request = $facebook->getSignedRequest();

      $page_id = $signed_request["page"]["id"];
      $page_admin = $signed_request["page"]["admin"];
      $like_status = $signed_request["page"]["liked"];
      $country = $signed_request["user"]["country"];
      $locale = $signed_request["user"]["locale"];

      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js&quot; type="text/javascript"></script>

      <img id = "share_button" src = "https://app.tabpress.com/fbui_share/share_button.png"&gt;

      if ($like_status) {
      include("index2.php");

      }
      else {
      include("index1.php");
      }

      ?>

      I can’t figure out how to combine the elements from your index.php page and mine (as well as how to put the share on the index1.php and index2.php pages – I tried adding the fb-root div, but while that might be the key, I can’t tell)

      Thanks!

    12. OK, figured it out. My index.php file needed no changes, it was just the index1.php and index2.php files that needed the new code. Thanks again!

    13. Hello,

      I just tried your code by just changing the app id but Facebook is giving me “An error occured. Please try again later.”

      Is anybody getting the same error ?

      Thank you for your help!

    14. Hi Maria Julia,

      I initiate permission request for permission to post to wall.

      HtH

      • sorry, is my first time doing a fan page (i dont know absolutly nothing!) … do you know some websites tutorial that teach me doing that???

        when i put the code first time this erro ocurred (saing that i need to try later). im using ifram tab app…

        sorry for the inconvenience

        (and sorry abot the english… im from brazil)

    15. chris l says:

      your own tutorial example doesn’t work even in TabPress-very embarrassing.

      • It works in TabPress, Chris, straight out of the box IF you implement it as directed in this tutorial (to see the working example, you’ll have to “Like” the HyperArts fan page). I simply copied and pasted code in this tutorial into TabPress. Make sure you include the link to the image for your Share Button.

        And don’t be embarrassed about not being able to get it to work. If you work at it, you’ll get it :-)

    16. Thanks for the tutorial. I had the error message too – but we figured out it was only in IE and was the Compatibility Mode chestnut. We took out the , after the appid in the first script and it all worked like a charm. Hope this helps.

    17. Hi Bill, thanks for the article.  I’m a bit confused, though. Where does the code go?  In the header?  Some in the body?  I’m unclear.  Thanks so much!

    18. Bill,
        Sorry but my last paragaaph lost its formatting.  I’d be happy to send that code sample via email.
      Cheers,
      Bob G.

    19. How to ask permission to post on friends/fans wall through my facebook fanpage?

    20. Anonymous says:

      I’d like to thank you guys for this post. It help me a lot.error codes

    21. Anonymous says:

      I’d like to thank you guys for this post. It help me a lot.error codes

    22. Bill,
        I’m trying to get your Share_button example to work on my hosted (I use Host Monster) Facebook App.   I put your recommended code into my index.php file as shown in CODE EXAMPLE A and the rest of your example into my FB App script as shown in CODE EXAMPLE B.   Note that I’ve substituted my own code to display a button that will call your code.   The scripts all run without error messages but the script in my App, exampe B, doesn’t display anything.  Please take a look and my scripts and let me know what I might be doing wrong.
      CODE EXAMPLE
      A://ADDITION REQUIRED BY FB:SHARE-BUTTON JAVA SCRIPT CODE EXAMPLE – TABPRESS SEE PG.88 8/23/11echo “FB.init({appId : ’138163634856′,});”;echo ” “;
      END CODE EXAMPLE A

      CODE EXMAPE B
      ////TAB PRESS TUTORIAL: ADD A SHARE BUTTON TO YOUR IFRAME TABE APPLICATION JUNE 6, 2011

      $(document).ready(function(){$(‘#share_button’).click(function(e){e.preventDefault();FB.ui({method: ‘feed’,name: ‘HyperArts Blog’,link: ‘http://hyperarts.com/blog’,picture: ‘http://www.hyperarts.com/_img/TabPress-LOGO-Home.png’,caption: ‘I love HyperArts tutorials’,description: ‘The HyperArts Blog provides tutorials for all things Facebook’,message: ”});});});

      END CODE EXAMPLE B

    23. Hi,

      I downloaded the code from here and have set it up on my page. It works fine in all browsers except Internet Explorer. The error that shows is: “An error occured. Please try again later.”

       I have already checked if I am loading the all.js more then once, and it is still showing this error.

      Any idea about what this can be?

    24. I can’t download the code why….

    25. I am getting the following error when someone clicks the share button…

      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.

      How can I get rid of this problem and show them that I do in fact 
      “own” the URL?

      Thanks

    26. IMPORTANT: The link URL has to be under the same domain as the page with the Share Button. For example, if your Share Button is hosted at

      http://www.MyDomain.com/share-button.html

      the link it shares must be at MyDomain.com.

      If your Share URL is on a domain/website other than the one where the button is, you’ll get the error message you describe.

      • Adam Taylor says:

        it’s likely that Ali Hawley (above) is trying to use this method to share a tab on facebook, by implementing this button ON that tab.Sadly, fb:share is the only remaining way to do this, ie:
        Use some CSS to style the “#sharebtn a”, etc.

        This article’s title may mislead some users trying to drive traffic to their FB tabs..

      • In a reply to Sean by Bill in a post from five months ago, bill says
        “You should be able to set the ‘link” property to point to any URL, including a Fan Page URL on Facebook.”
        Is this no longer the case? I was able to put the Share button on a Facebook iframe page hosted on a web server and link to the Facebook tab that had the iframe app on it. Now that does not work when I try it again and I get the API Error Code 191. Has Facebook changed thier policy, or is there some other way to do this now? Thanks, JR

        • Make sure that you set up your app with Secure URLs. Remember, your index page for your page tab has to be hosted securely.
          The Error 191 is probably because when you set up your app, you specified your Page Tab URLs, but not App on Facebook URLs. Add the URLs to that, as well, and it should work. Let me know.
          Here’s more on that: http://www.hyperarts.com/blog/tutorial-add-an-iframe-application-to-your-facebook-fan-page-fall-2012/#error191

          • Well, you were right, I did not have the App on Facebook URLs set, but I still have a problem. The posts are appearing on my wall instead of on the Facebook page tab with the Share button which is where they need to be. I had this working on another project and when somene made a post, it added it to the tab, which is used as the link in the Javascript code. That is not working now for some reason and I have tested that link and it does go to the tab. Any idea why that part isn’t working? Thanks, JR

            • Glad you got it working. As for Share Button posts appearing on the tab that the button’s on, I can’t help. The default way it works is to post it to your Wall.

      • Does that mean we can’t “Share” a Facebook app because the Share button can’t be hosted on it?

    27. Hello, I did everything and the share button is working except for the picture, what I’m doing wrong?

      https://www.facebook.com/MegaPet?sk=app_286717528013542

    28. The picture works for me, Ricardo.

    29. The picture works for me, Ricardo.

    30. The picture works for me, Ricardo.

    31. “An error occurred with Static HTML: iframe tabs. Please try again later.” ?!
      Whats wrong? thx!

    32. Hi Bill,

      Thanks for this tutorial. I am having problems with trying to use multiple Share buttons within the same i-frame tab. I am using unique IDs, the share button is hosted on the same domain as the page I am attempting to share.

      Can you think of why this might be happening? The first one works but any additional button does not.

      So close!!!

      Hope you can help

      Thanks

      Brian

    33. how can make the app to publish on user frindes wall autamtic??

      • You can’t. It violates Facebook’s terms of service, and it violates the privacy of users. The user has to want to post on their Wall. It’s up to them, not you.

    34. Hi,  firstly, thank you so much for such a great tutorial.

      In your example page moving the mouse onto the share button does not change it to the hand but leaves it as the mouse pointer – Is this browser specific – I’m using Chrome or is there a way to change it?

    35. Here’s how to use CSS to add a custom cursor to the Share Button:

      Just add this style to your stylesheet: img#share_button {cursor: pointer;}
      Or inline it on the page:

      <style type=”text/css”> img#share_button {cursor: pointer;} </style>
      I tested with IE 8 and with Firefox on the Mac (Lion) and it works fine.

    36. Here’s how to use CSS to add a custom cursor to the Share Button:

      Just add this style to your stylesheet:

      img#share_button {cursor: pointer;}

      Or inline it on the page:

      <style type=”text/css”> img#share_button {cursor: pointer;} </style>

      I tested with IE 8 and with Firefox on the Mac (Lion) and it works fine.

    37. I’m having exactly the same problem so any suggestions would be welcome.

    38. Yes, Mike, you can add multiple buttons to the tab.

      In looking over my article, I saw that it needed a number of things updated:

      1) You have to include the <html><body> … </body></html> tags in the index page (for IE!);

      2) You must use the “asynchronous” code for loading the JavaScript SDK.

      I also added a section on how to add multiple Share Buttons to the tab. I tested this with IE, Firefox and Safari, and it worked fine, as long as you change the IDs in the appropriate places.

      Your question resulted in my improving and updating this post, so thanks!

    39. Anonymous says:

      Thanks to your further suggestions and working example I was able to work out where I was going wrong so thank you for taking the trouble expand on your instructions.

      However, using the asynchronous version of code seemed to cause your FB.Canvas.setSize() solution for removing the scrollbars to break in some examples I tried. For me the standard SDK code eventually worked (once I removed my other errors) for the multiple buttons together with your  FB.Canvas.setSize() scrollbar solution

      • Mike, Did you check your tabs with IE 8? That’s the one that caused me the big headaches. When, with the standard SDK, the buttons worked fine with Chrome, Safari and Firefox, IE 8 was throwing errors until I switched to the asynchronous code *and* included the <html><body> … </body></html> tags.

        Please post your solution here, and make sure you surround your code with the <code> … </code> tags!

        Thanks!

        • I’ve double-checked and it seems to be OK in IE8, Chrome, Safari and FF

          At the following TEST page http://goo.gl/05k5D, test1 is with the standard code and test2 is with the asynchronous version, as in your example page Both Apps were configured the same at the back end re your suggested settings to remove scrollbars

    40. Yes, they seem to work. I’m going to test on my IE 8 to doublecheck!

    41. Can I add the Share button in the Tabpress tab content too? The problem I get is that if i make a Tabpress tab, it’s not my own application and therefore doesn’t have its own app ID. So do I have to make my own iFrame tab or is there a way to embed a Share button in a Tabpress tab?

    42. Hi Bill! Thanks so much for this article! It’s gotten me farther than I ever thought I would.

      Quick question – do you have any idea why Facebook would be adding a “captcha” before I’m able to share? Even when I get the captcha right, it says something’s gone wrong. Any help would be appreciated. Thanks!

    43. Hi Nina, The Share Button tutorial was not designed to be used by TabPress and likely won’t work since the app ID won’t match the TabPress App ID, and the URL used won’t match the domain that TabPress uses. Sorry!

      You would have to create your own custom Facebook app and our iFrame Page Tab tutorial shows how to do that.

    44. Hi Caitlin, I can’t say given the information provided.

    45. It’s exactly as I state: The URL for the app’s canvas page has to be the same domain as the URL the you’re using for the Share Button.

    46. Hi!

      First of all, awesome tutorial! have been looking for a while to find this!

      I only have one problem, somehow when I click on the share button it opens in a new tab instead of a pop-up window. The example button on the hyper arts Facebook does open in a pop-up and I would like to have the same. Does anyone know what might cause this? Thanks!

    47. Hi!

      First of all, awesome tutorial! have been looking for a while to find this.

      I only have one problem, when I click the share button the dialog opens in a new tab in my browser instead of a pop-up screen. The example button on the hyperarts Facebook does however open in a pop-up. Does anyone know what might causing this? Thanks!

    48. Thanks for the tutorial, but instead of running FB.ui I want to run PHP code. How can I do that?

    49. Hi is there a way to autoload this popup on page load?

    50. No.

      • Here ( http://www.facebook.com/dove?sk=app_120750214630623 ) after you fill out the form you get the popup when you are in the thank you page.

        What is the trick here?

    51.  how we can auto load it on page load.. as i have seen on different pages.. plz do answer i need this functionality urgently.. waiting for your response.

      • If you mean auto-click the Share button when the page loads? I haven’t seen this, and I don’t believe it’s possible. AND it’s a bad user experience. The user should decide whether or not to click the Share button!

    52. cabouabdo says:

      Awesome article! I’m trying to track how many shares I get from within the app, and was wondering if there is any sort of callback from the share process once it is completed? I’m currently tracking based on clicks on the share button, but I am afraid I don’t have accurate results because as of now I have no way of knowing if the user has followed through with the share process or clicked cancel. Any thoughts?

    53. Are you using Google’s Social Interactions tracking? You might read my post about Tracking Social Interactions with Google Analytics.
      And I assume you’re checking out Facebook’s Insights for Domains, yes? If not, read my post about this.

      • cabouabdo says:

        Thanks Tim! I’m not using GA Social Interaction tracking, but that’s looks like a good thing to consider. I’m wondering more about some sort of javascript callback after the app is shared. Maybe something I could use to trigger a thank you message after the share action? 

    54. I’m afraid I can’t help you there.

    55. asecondwill says:

      The share thing is deprecated. Iv’e just spent 24 hours trying to get the share & like buttons to work in a iframe page tab – with the share firing on page ready via jquery. fail.  epic fail.  

      • Hmm. I’ve gotten it to work, just today actually. What is the error you get? Are you using the latest JavaScript SDK code?

        • asecondwill says:

          Hi Tim, Thanks for replying, and for this website, its been a real help – appreciate it. 

           Yes latest SDK, linking directly.  Did you have any cross browser issues?  The errors varied – eg “an error occurred”  or just not showing up or js errors.  It seemed that the code to use the SDK was breaking the like button code.  do you have a link to a working example?ThanksWill

    56. Does this share button example work for you?

      • asecondwill says:

        Not reliably.  It seems to come and go with  errors to do with the URL we want to share (the iframe page tab link) and displays a pop up rather than the proper modal for non-ssl connections

        • I asked if *our* share button example worked for you. It shares our URL. Did you get errors with our example? If you’re having trouble with URLs and your share button, remember — and as clearly called out in my tutorial — the URL you share MUST be on the same domain as the page the share button is on.

          • asecondwill says:

            Yep i’m using your example,as you say, it wouldn’t work on our iframe page if i didn’t update the link URL.  

            The main issue i’m facing is the modal vs pop up.  Is there a  way to make the modal/lightbox fire rather than a pop up window?

            Thanks

            will

    57. jaguar infocrafters says:

      Hi, i am unable to download the code from the URL can u please share the code with me. i need this.

    58. This is great, thank you so much. It seems that posting to a timeline is the standard way the share panel works. Is there an easy way to modify this script to handle this?
      Thanks,
      John S.

    59. Hi, Bill! I have the question. Maybe it is off-topic, but i hope you would ask me. Question is: can i add album of thumbnails with some kind of chooser in popup dialog or i must construct popup by myself? This is very important for me! I am newbie! Or maybe you can give an advise? Thanks a lot!

    60. Good day,
      I am new at doing application, but I have been able to create a good one by following all your tutos which are really great! I’m now trying to add that “share button’, everything seems to work right except that when I click on the button nothing happens… (only the cursor change to the hand). Could you tell me what am I doing wrong?
      Thanks in advance for your answer (sorry for any mistakes, I’m french)

      • I can’t tell you what’s wrong without seeing and assessing your code. Unfortunately, I don’t have the time to do that. Sorry.

        • No problems, I just tried to use ONLY your example and it is working well. So at least I know it’s working, I should be able to find my problem.
          Thanks again, your tutorials ROCK!!

          • Thanks Vincent! I’m sure you’ll get it working. Feel free to report back here and let us know what the issue was and how you solved it!

            • Everything is working well now.

              I found my (your) problem after comparing your example (index.php) and your tutorial on this page.

              There is one line that is missing on this page compare to your tutorial :

              I think you should add it to your tutorial
              (lol, I’m not sure I am clear enough)

            • Thanks Vincent. I think you tried to embed a code example in your comment, and it didn’t come true.
              Can you repost it, but remove any script tags like <script> or any PHP code like <?php

            • Everything I posted is there.

              The code line mentionned above (div id=”fb-root” /div) is missing in your tutorial “STEP 1: Add code to load the Facebook JavaScript SDK into your HTML/PHP index file”.
              That is why I was not able to click on the “share button”. As soon as I added it it worked fine.

            • I’ll adjust the code example. Thanks so much for pointing that out!

            • You are welcome :o )

              Now just a last question:

              Is it possible to have the “share window” openning automatically when a user open a new page?

            • First, I amended my article to include the missing code snippet “fb-root”. Thanks again!
              A user would have to click on your Share Button to have it open. That’s the user’s decision to share, not the Page’s!
              BTW, I spent a month in Paris last year & decided it’s my favorite city on Earth (so far). France is a treasure.

            • Cool but I’m not from France, I am french Canadian from Quebec :)
              Thanks for your quick answer, your great work and have a good week-end!

            • Oops! Sorry! I hope that’s not considered a big insult to Québécois! I like Quebec too :-)

            • Haha! no problems :)

    Speak Your Mind

    *