Question

I want to add Facebook comments using JavaScript (jQuery) to be able to customise the data-href. I used the following code, but nothing appear in the div col2.

$("#col2").html(
    id+"<div class='fb-comments' data-href='http://127.0.0.1/GazaPlaces/' data-num-posts='2'"+
    " data-width='500'></div>"
);

What is the solution?

Answer 1

Use the Facebook JavaScript SDK:

<script>
    (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=75803274170";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>

If you already loaded it, and you then want to add another comments plugin, that is you dynamically added that div in your code, then you need to call the XFBML parse method:

FB.XFBML.parse();
or
FB.XFBML.parse($(id));

You can read more about it in FB.XFBML.parse.