How To Add Facebook Messenger To Your Website

Do you need a live chat plugin on your website? It would be great if your web visitors would chat with you through Facebook Messenger and you could message them back any time you want. However, you would need some kind of Messenger Widget on your site. Guess what? There is one. It's called the Facebook Customer Chat Plugin, and we've got the ways to add Facebook Messenger to your website today.

In this article we're going to cover:

What is The Facebook Customer Chat Plugin?
How To Install The Facebook Customer Chat Plugin on Website
How To Add Facebook Messenger to Website on WordPress
How To Add Facebook Messenger to Website on Wix
How To Add Facebook Messenger to Website on Shopify
How To Add Facebook Messenger to Website on Squarespace
How To Add Facebook Messenger to Website with GTM
FAQ About Facebook Customer Chat Plugin

What Is The Facebook Customer Chat Plugin?

Facebook launched the Customer Chat Plugin in 2017. It is one of the Facebook widgets for website. What makes Facebook Customer Chat better than regular live chat? When chatting using the Facebook Web Chat, your website visitors are chatting with you through a Facebook Messenger widget. Once they send their first message, you'll be able to message them back and find out more info about them through Facebook Inbox. You'll even be able to send broadcast messages to all the people who spoke with you through the Facebook Chat Plugin.

There are ways to add facebook messenger to website. It looks just like a live chat website plugin and it does add chat to your website, but the way it works means you basically add Facebook Messenger to your website. This is how to add facebook messenger to website. When chatting using the Facebook Web Chat, your website visitors are chatting with you through a Facebook Messenger widget. Once they send their first message, you'll be able to message them back and find out more info about them through Facebook Inbox. You'll even be able to send broadcast messages to all the people who spoke with you through the Facebook Chat Plugin. — Screenshot of Customer Chat Plugin

It looks just like a live chat website plugin and it does add chat to your website, but the way it works means you basically add Facebook Messenger to your website.

How To Install The Facebook Customer Chat Plugin

We're going to show you how to install a Facebook Messenger Plugin for your website using a special code we developed at Rocketbots. This code is better because it makes installation easier. Instead of pasting the two codes in two different places, we've created a way integrate a Facebook Messenger widget into your website with just one code. To install this code using our script you'll need:

A Facebook Page
A Rocketbots Account (it's free)
A Website

Now that you've got those out of the way, you'll just need to follow the steps below.

1 Log in to the Rocketbots platform and create a space. You will need a space to connect your Facebook page(s).

There are ways to Add Facebook Messenger to Your Website. To add a messenger widget to your website Create a Space on Rocketbots. This is how to Add Facebook Messenger to Your Website. — Create a Space

2 Select Facebook Messenger, press next then choose the Facebook Page you would like to connect.

There are ways to Add Facebook Messenger to Your Website. To add a messenger widget to your website Connect Your Facebook Page to Rocketbots. This is how to Add Facebook Messenger to Your Website. — Connect Your Facebook Page

3 Fill in your channel details and check add Facebook's Customer Chat Widget to your website?

There are ways to Add Facebook Messenger to Your Website. To add a messenger widget to your website Fill In Your Channel Details on Rocketbots.This is how to Add Facebook Messenger to Your Website. — Fill In Your Channel Details

4. White List Your Domains, Choose a Color and fill in your advanced settings.

There are ways to Add Facebook Messenger to Your Website. To add a messenger widget to your website White List Your Domains on Rocketbots. This is how to Add Facebook Messenger to Your Website. — Whitelist Your Domains

The reference code allows you to start a unique onboarding automation, if the contact comes from the Facebook Customer Chat Plugin.

There are ways to Add Facebook Messenger to Your Website. To add a messenger widget to your website Add Your Greeting Message on Rocketbots. This is how to Add Facebook Messenger to Your Website. — Add Your Greeting Message

5. Copy the Script and Paste it in the footer of your website. See how to add this footer for WordPress, Wix, Shopify, Squarespace and Google Tag Manager.

Copy the Script To Insert On Your Website

There are ways to add facebook messenger to website. To add a facebook messenger widget to your website Copy the script from Rocketbots. This is how to Add Facebook Messenger to Your Website. — Copy the Script To Insert On Your Website

6. Done. Load your website, and the Facebook Messenger Customer Chat plugin will appear in the bottom right of the page.

Example of Facebook Customer Chat Plugin on www.rocketbots.io/contact

There are ways to Add Facebook Messenger to Your Website. To add a messenger widget to your website check the page you installed the script on. This is how to Add Facebook Messenger to Your Website. — Example of Facebook Customer Chat Plugin on www.rocketbots.io/contact

How To Add Facebook Messenger to Your Website on WordPress

Make sure to follow steps 1 to 5 first. This will give you the code you need to copy into your WordPress site.

6 Add The Header and Footers Console on WordPress.

There are ways to Add Facebook Messenger to Your Website. To Add Facebook Messenger To Website Add The Header & Footer Console on WordPress. This is how to Add Facebook Messenger to Your Website. — Add The Header & Footer Console

7 Navigate To Headers and Footers.

There are ways to Add Facebook Messenger to Your Website. To Add Facebook Messenger To Website Open The Header & Footer Console on WordPress. This is how to Add Facebook Messenger to Your Website. — Open The Header & Footer Console

8 Add the Script To The Footer.

Add The Script Open The Header & Footer Console

There are ways to Add Facebook Messenger to Your Website. To Add Facebook Messenger To Website Add The Script Open The Header & Footer Console on WordPress. This is how to Add Facebook Messenger to Your Website. — Add The Script Open The Header & Footer Console

Done. You have now added Facebook Messenger Live Chat to your WordPress website.

How To Add Facebook Messenger to Your Website on Wix

Make sure to follow steps 1 to 5 first. This will give you the code you need to copy into your Wix site. Once logged into Wix and the site you want to edit has been selected, follow the steps below.

6 To open the Custom Code Form navigate to Settings > Advanced Settings > Tracking & Analytics > + New Tool > Custom.

Add a Custom New Tool In the Tracking & Analytics Tab

There are ways to Add Facebook Messenger to Your Website. Go to Settings in your site's dashboard. Click the Tracking & Analytics tab under Advanced Settings. Click + New Tool and select Custom from the dropdown menu. Wix have advanced settings for tracking tools and analytics. New tools include google analytics, google tag manager, facebook pixel, yandex metrica, verification code and custom for custom code. This is how to Add Facebook Messenger to Your Website. — Add a Custom New Tool In the Tracking & Analytics Tab

7 To fill in the Custom Code Form enter information into Paste the code snippet here > Name > Add Code to Pages > Place Code in > Apply

(Note: If you have multiple domains an additional option Select the relevant domain will appear in the Custom Code Form)

There are ways to Add Facebook Messenger to Your Website. Fill in the Custom Code Form (Note: If you have multiple domains the additional option Select the relevant domain will appear.) Paste your chosen code into the box Paste the code snippet here. Enter a name for your custom code and select the pages you want to add your code to in the Add Code to Pages dropdown menu. Finally, chose a Place Code in option for where the code snippet will be placed in your site's code. This is how to Add Facebook Messenger to Your Website. — Fill in the Custom Code Form

8 Your new Facebook Customer Chat Plugin will appear on your Wix site

Your New Facebook Customer Chat Plugin Is Installed

There are ways to Add Facebook Messenger to Your Website. Click Apply and your new Facebook Customer Chat Plugin is ready. Wix homepage will show your new facebook customer chat plugin for facebook messenger live chat on wix website. This is how to Add Facebook Messenger to Your Website. — Your New Facebook Customer Chat Plugin Is Installed

Done. You have now added Facebook Messenger Live Chat to your Wix website.

How To Add Facebook Messenger to Your Website on Shopify

Make sure to follow steps 1 to 5 first. This will give you the code you need to copy into your Sqaurespace site.

6 Navigate to Online Store and edit code.

There are ways to Add Facebook Messenger to Your Website.To add Facebook Messenger Live Chat to your shopify store Edit Your Online Store Code. This is how to Add Facebook Messenger to Your Website. — Edit Your Online Store Code

7 Open the footer.liquid section and paste the script

There are ways to Add Facebook Messenger to Your Website. To add Facebook Messenger Live Chat to your shopify store Add The Script. This is how to Add Facebook Messenger to Your Website. — Add The Script

Done. You have now added Facebook Messenger Live Chat to your Shopify website.

How To Add Facebook Messenger to Your Website on Squarespace

Make sure to follow steps 1 to 5 first. This will give you the code you need to copy into your Shopify site.

6 Login In To Squarespace, select your site and open Settings

There are ways to Add Facebook Messenger to Your Website. To Integrate Facebook Messenger Into Your Squarespace Website Open Your Site Settings. This is how to Add Facebook Messenger to Your Website. — Open Your Site Settings

7 Open Advanced Settings

There are ways to Add Facebook Messenger to Your Website. To Integrate Facebook Messenger Into Your Squarespace Website Open Advanced Settings. This is how to Add Facebook Messenger to Your Website. — Open Advanced Settings

8 Open the Code Injection console

There are ways to Add Facebook Messenger to Your Website. To Integrate Facebook Messenger Into Your Squarespace Website Open Code Injection. This is how to Add Facebook Messenger to Your Website. — Open Code Injection

9 Add the script

There are ways to Add Facebook Messenger to Your Website. To Integrate Facebook Messenger Into Your Squarespace Website Add The Script. This is how to Add Facebook Messenger to Your Website. — Add The Script

Done. You have now added Facebook Messenger Live Chat to your Squarespace website.

FAQs

What if the user isn’t signed in?

If the user is not signed in to Facebook, the widget will still call out to the user to chat. Only this time they’ll be prompted to sign into Facebook. Which is as simple as Facebook popping up their own window in the user’s browser, and prompt a sign in.

How can I access the conversation?

Simply sign in to your Rocketbots account, and navigate to the Messages page in the lefthand menu. Here you’ll see a list of everyone who’s reached out to you.

How can I provide 24/7 support?

If you’ve connected your Facebook page with Rocketbots, you’ve already got the winning mix for a real 24/7 support experience in the palm of your hand. Rocketbots uses AI to learn from your conversations. As you continue chatting, the AI gets smarter until it’s ready to start automating responses for you. Making it more likely to have the platform respond to users after hours. So just keep chatting and soon you’ll have a true 24/7 support machine.

Why A Facebook Messenger Widget Is Better Than Live Chat

Facebook Web Chat Creates Persistent, Consistent Engagement

With traditional live chat website plugin, once the user has left the website, you've lost them forever. Your only hope of continuing the conversation is them returning to your site. This is no longer the case once you add Facebook Messenger to your website.

With a Facebook messenger widget on your website all your conversations are saved in Facebook Inbox. This means you can pick up a conversation with a user who chatted with you even if they left your website.

All your messenger widget conversations will be saved to Facebook Inbox. This is a benefit when you Add Facebook Messenger to Your Website. — Facebook Inbox

Along with the conversation, you get to see some of their basic profile info, helping you serve the customer better than any live chat could.

A Facebook Messenger Plugin Let's You Build A Facebook Messenger Contact List

Now that people can message you easily through Facebook using Facebook Customer Chat, they'll be added to your contact list forever.

With a Facebook Messenger Widget on your site you can attain 90% open rates on your newsletters. This is a benefit when you Add Facebook Messenger to Your Website — Facebook Messenger Open Rates

You can think of a Facebook Messenger subscribers list the same way you do an email subscriber list. You can use this as a new communication channel with your audience. You can even use it to deliver messenger newsletters with 90% open rates and 60% click rates.