How to Embed the Facebook Customer Chat Widget in your Website

Nowadays, Facebook is not only about re-connecting with your schoolmates. Facebook is not only about walking down the memory lane. It is a commercial tool for many entrepreneurs. While analyzing his/her market, it would never come as a surprise to find a huge number of customers on Facebook. With monthly active users of about 2.07 billion, it’s evident. So, Messenger would be the best option to interact with their potentials through Facebook.


Facebook Customer chat widget

Messenger has introduced the new Facebook customer chat widget option. It lets you
embed the widgets to your active business website. Yes, ‘All we need is a Facebook
account’. Both the sides (The Business owner and the customer) have to connect
through Facebook. Then they can interact, without actually leaving the official company

Pros of using Facebook Customer chat widget

Facebook customer chat widget adds to the customer satisfaction. End to end
interaction is also made possible with this facility. The main advantages of using

Facebook customer chat widget are

1. You get to know your customers well. Then it will be easy to turn your potentials into
regular customers. This would catapult the growth and development of your company.

2. Less complex process for management as well as the customer. We have explained
the process in a clear-cut manner in this article (Keep reading to learn it!)

3. It is less expensive if you are going to use Facebook customer chat widget. There are
several apps that need you to pay a hefty amount to enable the same facilities. In this
case, you need not spend a penny! So you will be able to stick on to the proverb-‘A
penny saved is a penny gained’.

4. You get to understand the demands and requirements of your customer. You need
not deep dive into the analytics. You will be able to interact with your customer and
have an honest answer from them.

5. Automatic re-loading enables you to keep track of the chat history. This makes your
business effortless. Also, it will display the recent chat activities on your website or in
the or Messenger App.


How to Embed Facebook Customer chat widget

The process is as uncomplicated as this: -The Visitor will find the Facebook icon on your webpage. To be able to contact the much-skilled Entrepreneur (Of course, it’s you), they will have to click that icon. Then, they have to type their message. You will receive the notification when you are online. Then you can interact with the customer on the website. You can also use the official Facebook Pages Manager App. You will only need to install it on your phone.

There are a few browsers which do not support this option:-
Internet Explorer
Messenger in-app browsers
It is a trouble-free Six Step process. But the benefit would be much.

1. Creating a Facebook App

First of all, you need to create a Facebook app. Go to and click the option “Add a new app” to create a new Facebook app before naming it.

2. Generating an App ID

After naming your app, click the create button. You can generate your own App ID. This helps you for future reference. Note down the number and Bookmark it. Thus, you can make sure to avoid any confusion.

3. Embedding the widget

Go to Facebook page->Settings tab-> Messenger- >Whitelisted domain. Now, you must enter the complete URL of your website. Save it. The user may want to embed the widget on many websites. it is possible to do it for many numbers of domains as per the requirements of the user.

4. Obtaining the Facebook ID

It is a must to get the Facebook Page ID of the particular page before connecting with the customer chat widget. Again, be vigilant enough to save this for easy reference (which you will learn at Step5. Keep reading and scrolling! You are almost there! ). This extra feature enables you to view all the conversations and interactions.

5. Open the website template.

Open the template of your website.
After opening it, copy-paste the code in the footer area of your template. Enter your App_ID and Facebook Page_ID, which you have bookmarked as requested by us in Step 2 and Step 4. Replace it with the given code, so that ‘your’ Facebook chat widget goes live.

6. What to do if Facebook Messenger logo is not visible on your web page?

It’s almost over. Now is the time to make a final move. The Facebook messenger logo may not visible on your web pages. Try again after clearing the cache. It would only be visible if the website domain is present in the whitelisted domain. (Refer Step 3).

Other features of Facebook Messenger

1. It also offers other valuable features like:-
Welcome, message and greetings. When a customer enters the chat and starts the conversation, they would receive this.

2. Status message-It will inform the customer that you are not available for the live chat when you are away. This is what you call an away message.

3. Follow this simple process for configuration of these messages. Go to Facebook
Page->Settings- >Messaging. Change the response Assistant section as per your needs.

P.S:- This is for the knowledge of Adblock Users- the widget functions only through Facebook.

Suppose you use Adblock add-on, it might block the loading of social plugins. If that is the case, then the chat widget would remain unsupported and it would remain inactive for you.

Requirements for using Facebook Customer chat widget

The Facebook JavaScript SDK is a must to include if you plan to use the customer chat plugin.The customer should be connected to their Facebook account or Messenger app. Then they can straightaway start messaging to your bot. If not, then they will have to log in and they will receive an invitation to create a Facebook account.


Every Entrepreneur would look for the growth of their company in a consistent manner.
By using Facebook Customer chat widget, the process is neat and curt. The user needs to own a Facebook account and a Messenger app. Thus, you need only two Facebook accounts to have a good bond with your potential customers.


Leave a Reply