There are many live chat systems that you can use to interact and chat with visitors on your site. Some are simple, others are sophisticated systems using AI or bots. But amongst the most effective (especially for entrepreneurs and small businesses) is the humble Facebook Messenger. Here’s how to install Facebook Messenger live chat on your website in just 10 minutes.
Step 1: Customise your Messenger chat plugin
As a Facebook Page Admin for your business, navigate to the setup tool for the Messenger Platform.
- Go to Page Settings > Messenger Platform
- In the ‘Customer Chat Plugin’ section, click the ‘Set Up’ Button
Language and Greeting Message
On the first screen, you can customise the language and greeting message that will appear on the customer chat popup widget. I recommend that you keep this simple.
Displayed Response Time and Theme Colour
On the next screen, you can customise the displayed response time and theme colour. I suggest keeping the displayed response time realistic but optimistic. You don’t want to mislead those who send you a message, but you don’t want to put them off either. Select a colour that fits your brand or website. I consider it perfectly fine to deviate from the default blue. Facebook Messenger is so widespread that you are unlikely to end up confusing your visitors. They should easily recognise the Messenger logo even in a different colour.
Finally, set the whitelisted domains on which the customer chat may be displayed. This will be the domain names of all the sites that you intend to install the customer chat on.
Step 2: Install Customer Chat code
On the last screen above, copy the automatically generated code snippet. Paste this code snippet into the header of your site.
Do you have a WordPress site?
In your WordPress admin console, go to Appearance > Customise. Find if there is a place somewhere in your Theme settings to allow you to easily insert scripts into the theme header. If so, simply paste your Customer Chat code (from Step 1) into this section. And you’re done!
If your theme settings does not have this option, install a WordPress header and footer management plugin. This will give you a user interface similar to the above. There are two free WordPress plugins which I would recommend for this: “Head, Footer and Post Injections” and “Insert Headers and Footers“.
Alternatively, you will have to edit your Theme’s header code via the header.php file. You will have to update this again if you change themes. Find the header.php file via Appearance > Editor in your WordPress admin console. Locate the </head> tag and paste the Customer Chat code (from Step 1) just above the </head> tag. Click “Update file” and you’re all set!