How do I insert the facebook comment plugin using javascript? My website is ajax-driven and I need to load/reload the facebook comment plugin depending on a hash (index.html/#frontpage) -> (index.html/#movie1). My first thought was to use innerHTML:
document.getElementById('facebook').innerHTML = "<div id='fb-root'></div><fb:comments href='http://viljegse.dk/' num_posts='10' width='572'></fb:comments></div>";
This however doesn't work, so I tried creating the elements and then appending them, but then there is the <fb:comments> element, which is a problem.
Best regards,
Ulrik
FB:Root should be a part of the page at build time, and use the Javascript provided by FB to asynchronously load Facebook JS libraries on document load....just like FB describe.
Then, insert the FB comments using
document.getElementById('theplace').innerHTML="<fb:comments blah blah blah></fb:comments>"
and THEN
FB.XFBML.parse(document.getElementById('theplace'));
This bit of code will initialise the FB:Comments.
You can see a working example of this on my page at Track Vision - races page
I spent a while sweating on this code, but it's all functional now! FB documentation is shocking!
All the best
I was able to solve the problem calling FB.XFBML.parse on an onLoad() callback
