#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2006
    Posts
    224
    Rep Power
    13

    Thumbs up Facebook Like Button Help Needed


    Hi all,

    I want (like so many others) to have my like button 'like' the current page, which is dynamic in PHP. The following code displays the like button, but it does not get the url, it gets the url set in the Application within facebook (the login page for my site in this case). The code starts with the bottom part of the Facebook Javascript SDk before going onto my code:

    Code:
      // Load the SDK's source Asynchronously
      // Note that the debug version is being actively developed and might 
      // contain some type checks that are overly strict. 
      // Please report such bugs using the bugs tool.
      (function(d, debug){
         var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement('script'); js.id = id; js.async = true;
         js.src = "//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
         ref.parentNode.insertBefore(js, ref);
       }(document, /*debug*/ false));
    </script>
    
     <script type="text/javascript">
    var sUrl = window.location;
    document.getElementById('fb').setAttribute('href', sUrl);
    </script>   
    <div class="fb-like" id="fb"  data-send="true" data-layout="button_count" data-width="60" data-show-faces="true"></div>
    In this code I have returned the data-href element, but I now get an error stating that Facebook needs an absolute url:

    Code:
      // Load the SDK's source Asynchronously
      // Note that the debug version is being actively developed and might 
      // contain some type checks that are overly strict. 
      // Please report such bugs using the bugs tool.
      (function(d, debug){
         var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement('script'); js.id = id; js.async = true;
         js.src = "//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
         ref.parentNode.insertBefore(js, ref);
       }(document, /*debug*/ false));
    </script>
    
     <script type="text/javascript">
    var sUrl = window.location;
    document.getElementById('fb').setAttribute('href', sUrl);
    </script>   
    <div class="fb-like" data-href="www.mysite.com" id="fb"  data-send="true" data-layout="button_count" data-width="60" data-show-faces="true"></div>
    I have tried adding http:// at the start of the url to no avail so am wondering what everyone else is doing. Is there a fix? Or is there a better solution to my problem?

    Thanks,


    G
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    26
    Rep Power
    0
    I'm not very familiar with Facebook, and have my own opinions about "Like" buttons but from the code you've posted and what you've described, it sounds like the issue is here:

    javascript Code:
    var sUrl = window.location;
    document.getElementById('fb').setAttribute('href', sUrl);


    Without knowing more about the way Facebook operates as regards pages, I'm not sure how to approach getting the proper URL with JavaScript.

    However, for a quick hack, were you to simply change the sURL variable to your website I wonder if that would do the trick:

    javascript Code:
    <script type="text/javascript">
      var sUrl = "http://www.mysite.com/";
      document.getElementById('fb').setAttribute('href', sUrl);
    </script>


    The data-href wouldn't be needed for this hack to work. Let us know how it goes.

    - Null
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2006
    Posts
    224
    Rep Power
    13
    Thanks, sadly that didnt work. If you have any other ideas that would be great, in the meantime I will get back to the Facebook development notes.

    G
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2006
    Posts
    224
    Rep Power
    13
    Ok so here is an update, I have tried the following approaches without success. The annoying thing is that in other forum posts these solutions seem to work for the recipient. On another note I use urlencode on the query string if that makes a difference. Any how here are some of the code that I have used to date without success:


    PHP
    PHP Code:
    <?php $url basename($_SERVER['REQUEST_URI']);?>
    <div class="fb-like" data-send="false" data-layout="button_count" data-width="450" data-show-faces="true"></div>
    and JAVASCRIPT:

    Code:
    <div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=186609524720286&amp;xfbml=1"></script>
    <div id="fblikeblock"></div>
    <script>
        var url = 'http://apps.facebook.com/inflatableicons/image_preview.html?y=120';
        jQuery("#fblikeblock").html('<fb:like id="fbLike" href="'+url+'" send="true" width="450" show_faces="true" font=""></fb:like>');
        FB.XFBML.parse(document.getElementById('fblikeblock'));
        console.log(document.getElementById('fblikeblock'));
      </script>
    and lastly Facebook's own parser:

    Code:
    <fb:like></fb:like>
    All return the url that I have registered with Facebook - my login page.

    Any help would be great.

    Thanks,


    G

IMN logo majestic logo threadwatch logo seochat tools logo