Help Centre

Support > Designing and Building Your Website > Adding Your Content

How To Add Facebook Live Chat To Your Website

Offering your customers more ways to contact you has become increasingly important when selling online. A great way to communicate with visitors to your website in recent times is to offer a live chat feature on your website.

Facebook now offers a free integration of their messenger platform for you to use on your website. This can be completely managed through your Facebook account, meaning that you can respond to enquiries wherever you are. 

The process to get this plugin setup is simple and you can change your colours and introductory message to style the live chat box to suit your website.

It is not possible to activate this feature through Facebook’s mobile app. This plugin should be installed using a desktop. 

Some Adblockers prevent the Facebook Live Chat icon from displaying on the page. You may have to switch adblockers on your browser off  temporarily while you install the feature on your website. 
 

How To Obtain Your Facebook Messenger Code

  1. Go to your Facebook Page (This cannot be set up through your personal Facebook Profile - you must have a Business Page).

  2. Click Settings in the top right of the page.

  3. Select Advanced Messaging from the left-hand menu.

  4. Scroll down to Whitelisted Domains and enter your FULL URL. This must include the https:// protocol.

  5. Click Save

Facebook Advanced Messaging - Whitelisted Domains Field

  1. Go to Messaging in the left-hand menu

  2. Scroll down to Add Messenger to your website and click Get Started

  3. Adjust the setup to your preferences through steps 1. and 2.

  4. In step 3, add your website URL as you did previously to the box on the left before copying your code.

  5. Copy the code on the right to your clipboard.

Facebook Messenger Plugin Code

 

How To Add Your Facebook Messenger Code To Your Website

  1. Log into your Create Account.

  2. Select Content on the Top Menu.

  3. Click HTML Fragments from the left-hand menu.

  4. Click on the New HTML Fragment button at the top of the screen.

  5. Give the HTML Fragment a description for reference (e.g. Facebook Messenger Widget).

  6. Paste your HTML code into the large HTML Code box.

  7. To stop the Live Chat opening on each new page a user visits, you need to add a line of code to the code Facebook gave you. You should include:

    greeting_dialog_display="hide"

    This should be placed where indicated in the screenshot below:


    How to stop Facebook Customer Chat Plugin from opening on every page













  8. In the Type section, select the Manual option.

  9. Click Add HTML Fragment to save your code.

  10. Next, click Site Footer from the left-hand menu.

  11. Add your HTML Fragment to the Custom Footer Content by clicking the HTML icon on the toolbar, selecting your HTML Fragment from the drop-down list and clicking the Save Changes button when done.

Adding A HTML Fragment To Your Site Footer

  1. Publish your site for the changes to take effect on your live website.

More Questions?

If you have any further questions, please get in touch and we will be happy to help.

Get in Touch