How to add the facebook messenger plugin (customer chat plugin facebook) your to website

Today i will show you how to add the facebook message widget to your website (Customer Chat Plugin) . 

The Facebook Messenger Platform's customer chat plugin allows you to integrate your directly into your website. This allows your customers to interact with your business page anytime with the same time.

More Details about Customer Chat Plugin : click here

How to setup is the plugin : 

Step 1 :
Use can page this code before </body> tag

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId            : 'PASTE YOUR APP ID',
      autoLogAppEvents : true,
      xfbml            : true,
      version          : 'v2.12'
    });
  };

  (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 = "https://connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>

<div class="fb-customerchat" page_id="PASTE YOUR PAGE ID HERE"></div>

1. If you not creating app in facebook platform then create your app : Create New App Link. Already created the just copy the APP ID then paste in code.

2. Copy the page id form page. How to find the page id form page.
    Go to about section in the last is your facebook page id.

3. Add your website the WHITELIST DOMAINS.

You will need to make sure you can access the following: 

1. Your Facebook business page (the ABOUT section) 
2. Your Facebook business page SETTINGS > MESSENGER PLATFORM > WHITELIST DOMAINS 
3.  https://developers.facebook.com/app
4. Your website's HTML section

Video Tutorials :