Putting one like button on a page is very simple and comes down to pasting the code from Facebook like button generator found here.
It gets a bit more complicated when we need to add more than one button on a page along with a dynamically generated content. Best example I can think of is a search results page where every search result has it’s own like button.
Enough talk lets get down to the business
Prepare
Put this somewhere in your page. Official Facebook documentation changes it’s recommendation from time to time, so let’s say just put it before </body> tag.
<div id="fb-root"></div>
Insert your Like buttons code
<fb:like href="http://example.com" send="false" layout="button_count" show_faces="false"></fb:like>
Initialize Like buttons
In your JavaScript code after inserting all the fb:like tags you need to initialize all those buttons. You can do that by running below code
window.fbAsyncInit = function() {
FB.init({appId: 'your app id', status: true, cookie: true, xfbml: true});
};
(function() {
var e = document.createElement('script');
e.async = true;
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
Remember to change ‘your app id’ to your actual app id.
