javascriptfacebookxfbml

Update FB:Like URL Dynamically using JavaScript


I'd like to change the URL to like of an FB:Like button dynamically using JavaScript.

Right now I've only been able to change the href attribute of the fb:like tag (I've pasted the code below). But simply changing the href doesn't seem to work. Perhaps I have to re-initiate the FB:Like button, but so far I can't figure out how..

function update_share(container, url) {
  // update fb:like href value
  var container = container[0] || document.body;
  var button = container.getElementsByTagName('fb:like');
  button[0].setAttribute('href', url);
}

Solution

  • It works for me for XFBML tag as well without using FB iframe and even works with multiple FB like calls for AJAX.

    You just need to wrap the entire XFBML code in JS/jQuery and parse it as shown below:

    $('#like').html('<fb:like href="' + url + '" layout="button_count" show_faces="false" width="65" action="like" font="segoe ui" colorscheme="light" />');
    if (typeof FB !== 'undefined') {
        FB.XFBML.parse(document.getElementById('like'));
    }
    

    HTML code:

    <span id="like"></span>