How to add Facebook Like Button to a website

Follow these steps to add Facebook Like button to your website:

Add the code below in the head section of your html page. The code includes and initializes the Facebook SDK.


    <script>
   window.fbAsyncInit = function() {
   FB.init({
      appId :'paste your appId here',
      autoLogAppEvents : true,
      xfbml : true,
      version : 'v7.0'
    });
   };

</script>
<script async defer src="https://connect.facebook.net/en_US/sdk.js"></script>

Next, add the following code to display Like button in your html page:


    <div class="fb-like" data-href="your facebook page url here" 
    data-width="" data-colorscheme="light" data-layout="button_count" 
    data-action="like" data-size="small" data-share="true"></div>

Example


<div class="fb-like" data-href="https://www.facebook.com/tutorialsbuddy"
 data-width="" data-colorscheme="light" data-layout="button_count" 
 data-action="like" data-size="small" data-share="true"></div>

To show Facebook Like button only, simply update data-share="true" to data-share="false" in the above code.

To show Facebook Share button only, simply use the code as follows:


    <div class="fb-share-button" data-href={window.location.href} 
    data-width="" data-colorscheme="light" data-layout="button_count" 
    data-size="small"></div>