Add Facebook Customer Chat Widget to your website

facebook messenger implementation

Having live chat on website is very important for companies. Live chat help company to in many way few of them are mentioned below.

Live chat benefits

Reduce expenses: it helps to reduce your call cost and manpower needed for calling.
Improve customer service and loyalty: Live chat help to provide better customer service which increases customer loyalty towards the company.
Discover customer pain points: Help to resolve customer issue and pain points. It helps the company to resolve customer issue faster. 

Other Utility Tools

Implement Facebook Customer Chat Widget

Facebook has opened its facebook messenger service for all website owners. To implement facebook messenger. Kindly follow the below steps, it’s for free.

Step 1: Create a Facebook page for your website. About section, you will find Page ID.

facebook page id

Step 2: In the second step we need to whitelist our domain. In Facebook, page setting click on Messenger Platform and enter your domain in White-listed domains section.

Whitelist facebook domain

Step 3: Insert facebook messenger SDK on your website. The code has given below just change your facebook page id and you are done.

Facebook SDK for FB messenger
<!-- Load Facebook SDK for JavaScript -->
<div id="fb-root"></div>
<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 = 'https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js#xfbml=1&version=v2.12&autoLogAppEvents=1';
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Facebook Page ID and welcome message

You just need to change Facebook page id you can also change greeting message too.

<!-- Your customer chat code -->
<div class="fb-customerchat"
  attribution=setup_tool
  page_id="1762973283951872"
  logged_in_greeting="You have any request? Let us Know."
  logged_out_greeting="You have any request? Let us Know.">
</div>

Video to implement facebook chat widget

Comments Your Suggestions

Leave a comment