Add Facebook Messenger live chat widget to your website (2024)

Ruben Buijs

Founder & Digital Consultant

Written on Sep 17, 2023

Updated on Feb 12, 2024

12 minutes

Blog

Ready to level up your customer engagement? Adding a Facebook Messenger live chat widget to your website could be the game-changer you've been looking for.

This simple yet powerful tool not only facilitates real-time conversations with your visitors but also integrates seamlessly with your existing Facebook business ecosystem.

Table of contents

  1. Add Facebook Messenger chat widget to your website
  2. 1. Add Facebook Messenger chat using a link for your business
  3. 2. Free Facebook Messenger widget using Boei
  4. 3. Integrate Facebook live chat plugin for customer chat
  5. What is a Facebook messenger live chat widget?
  6. Why add Messenger to your website?
  7. Best plugin for Facebook customer chat
  8. FAQ
  9. Conclusion

Add Facebook Messenger chat widget to your website

So, now you want to add Facebook Messenger as a contact option on your site. But how?

There are three methods:

  1. Open Facebook Messenger using a link (simple)

  2. Get Facebook Messenger chats using Boei (simplest)

  3. Adding the Facebook Messenger script to your website (advanced)

For this to work, you need to create a button on your website.

To open Facebook Messenger, you can use the following link format.

http://m.me/<reference>

You can replace <reference> with a page ID, or with a username. This is a URL that you can put in an HTML link, like:

<a href="http://m.me/<reference>">Chat</a>

2. Free Facebook Messenger widget using Boei

Boei lets your customers chat with you via their favorite channels like Facebook Messenger, WhatsApp, Viber, Slack, Telegram, and many other chat channels.

Boei is a Facebook chat plugin for your website.

When you set up Facebook Messenger, Boei will look like this:

img

In Boei, you can create a new (so-called) helper for Facebook Messenger.

Here you can fill in your Page ID or Facebook username.

img

Next to Facebook customer chat, you can also add many other channels (like WhatsApp chat or Telegram, see here).

Or even an embedded contact form and newsletter subscription.

You can easily personalize and customize your messenger button in Boei to match your style.

And it already contains the messenger icon so it is super easy. You can also preview the widget so it is ready to use in no time.

Boei is super easy to install on any platform, like Wordpress or Wix, see the documentation.

Also, Boei is super lightweight and does not need to use the Facebook Javascript library.

3. Integrate Facebook live chat plugin for customer chat

Facebook has developed a messenger plugin that allows people to chat with businesses on their websites.

Let's talk about integrating the Facebook Messenger customer chat plugin onto your website.

This handy tool allows people to contact and interact with your business directly from your webpage, creating a smooth omnichannel experience.

This is how it will look like:

img

To add a Messenger chat plugin on your website, you'll first need a Messenger account linked to your Facebook page.

To install Facebook's widget on your website, you follow these steps. These are not super simple steps, but you will get there.

  1. Get your Facebook account Page ID

  2. Whitelist your domain name

  3. Embed Facebook SDK and plugin code snippet

  4. Set up notifications

Further info and options can be found on this Facebook page

When using the messenger customer chat plugin from Facebook, you should be aware of a few things:

  • You need to have a Facebook business account / page. You cannot use a personal Facebook profile.

  • Facebook requires its Javascript framework to be loaded. This is quite heavy and may slow your website down.

  • Some browsers / Ad blockers are blocking Facebook's javascript which may disable the chat completely.

Here is the step-by-step guide to get this chat on your website:

1. Get your Facebook Page ID

First, you’ll need to retrieve your Facebook page ID.

You can do this by navigating to your page, clicking on the About tab, and scrolling to the bottom of the page.

There, you will see your page ID (It should be a number).

Alternatively, you can type the name of your Facebook page into FindMyFbId and find your numerical Facebook page ID.

2. Whitelist your domain name

You need to whitelist your domain(s), which is a security measure.

  1. Click Settings at the top of your Page

  2. Click Advance Messaging on the left

  3. Edit whitelisted domains for your page in the Whitelisted Domains section

img

Ensure to add in https:// and http:// variations. Don't forget to hit the save button.

3. Embed Facebook SDK and plugin scripts

Now it is time to add Messenger to your website.

Add the Facebook Javascript SDK and the Customer chat plugin.

Copy the generated code and install it on your website.

Here you need to fill in your Facebook Page ID, that you got from step 1.

Within the page settings, you'll find the option to add a Messenger chat button, enabling a more personalized experience for your site visitors.

From here, the installation process involves steps to generate a numeric code which you can embed into your website's header.

This code triggers the chat plugin to appear, whether you're using xFBML or iframe plugins.

4. Set up notifications

It is useful to get notifications when users are trying to chat with you on your Facebook chat widget.

Set up notifications of FB Messenger or download the desktop app or the mobile app from the Appstore. You can also see the chat history and log here.

5. More settings to consider

The Messenger customer chat plugin allows for seamless conversion between the Messenger app and the Facebook inbox, ready for you to use.

It's possible to add the Facebook Messenger chat button in guest mode, allowing users to chat without logging into messenger.com, and even continue the conversation if they've left your website.

Moreover, you'll want to enable the "reopen" function; this allows any user who chatted with you to reopen their conversation, enhancing the user experience they get.

What is a Facebook messenger live chat widget?

timothy-hales-bennett-OwvRB-M3GwE-unsplash

A Facebook Messenger widget is a powerful tool that allows website owners to integrate the popular Facebook Messenger platform into their websites seamlessly. With this widget, you can add a chat button or icon to your website, enabling visitors to engage in real-time conversations with you or your team directly through Facebook Messenger. It provides a convenient and familiar messaging experience, as most people are already familiar with using Facebook Messenger on their mobile devices or computers.

Adding a Facebook Messenger widget to your website can enhance your customer support capabilities and improve communication with your website visitors. They can reach out to you with any questions, concerns, or inquiries they may have, all without leaving your website. This feature makes it easy to provide immediate assistance, address customer needs, and build strong relationships with your audience.

You can use additional features and customization options with Boei's Facebook Messenger widget. From setting up the widget in your page settings to integrating it with your Messenger account and website domain, Boei provides a seamless experience. You can also access chat history, utilize the Facebook SDK, and even enable a guest mode for visitors who don't have a Facebook account. Boei goes beyond being just another live chat plugin, providing a robust and user-friendly messenger platform for your website.

Why add Messenger to your website?

The Facebook Messenger widget offered by Boei is a versatile and feature-rich tool that can significantly enhance your website's functionality and communication capabilities. Here are several reasons why you should consider using the Facebook messenger widget, along with the benefits it provides:

  • Seamless Integration: The Facebook messenger widget allows you to integrate the popular Facebook Messenger platform into your website seamlessly. Adding a chat button or icon can give your website visitors a familiar and comfortable messaging experience.

  • Real-Time Communication: The Facebook messenger widget lets you engage in real-time conversations with website visitors. It enables you to respond to inquiries, provide support, and address customer needs instantly, improving customer satisfaction.

  • Customization Options: Boei's Facebook messenger widget offers various customization options. You can customize the widget's appearance, chat icon, and quick replies to match your website's branding and design, ensuring a seamless user experience.

  • Increased Conversion Rates: The Facebook messenger widget can significantly improve conversion rates by offering a direct and convenient communication channel. It allows you to engage with potential customers, answer their questions promptly, and guide them through their buying journey.

  • Comprehensive Messaging Features: The Facebook messenger widget offers a range of features to enhance your communication. You can send messages, access chat history, and even offer quick replies to provide efficient and personalized customer support.

  • Easy Installation and Setup: Boei simplifies the installation process of the Facebook messenger widget. With just a few steps, you can successfully set up the widget on your website, ensuring you're ready to connect with your website visitors in no time.

By leveraging the power of the Facebook messenger widget from Boei, you can enjoy these benefits and more, ultimately improving customer satisfaction, increasing conversions, (and other omnichannel metrics) and enhancing the overall user experience on your website.

Add Messenger to your Facebook Page and enable Facebook Chats for a familiar and comfortable messenger. Utilize the FB Customer chat plugin to offer technical support and efficiently resolve questions in conversations with users.

Best plugin for Facebook customer chat

Boei is more than just a live chat plugin. It is a comprehensive communication platform that allows you to seamlessly integrate Facebook Messenger into your website, unlocking a world of enhanced communication and support features. With Boei, you can easily add Facebook Messenger to your website, providing visitors with a familiar and comfortable messaging experience.

By leveraging the power of Boei, you gain access to a range of advanced functionalities. The meta business suite empowers you to customize settings, manage conversations, and track important metrics to optimize customer support efforts. You can effortlessly add the Messenger chat plugin to your website using HTML code, whether using a site builder or coding directly. Boei caters to various platforms, including Squarespace websites, ensuring compatibility and ease of integration.

With Boei's user-friendly admin panel, you can efficiently handle all aspects of your Messenger integration. From offering technical support and resolving customer queries to engaging in personalized communication, Boei equips you with the tools and features needed to deliver a seamless and efficient support experience. Furthermore, the fast installation process ensures you can get up and running quickly, reaching your users through the quickest tool available.

Boei is a comprehensive solution beyond being a mere chat plugin. It empowers you to add Facebook Messenger to your website, leverage its advanced features, and optimize your customer support capabilities. With Boei, you can offer personalized communication, resolve queries, and track conversations while providing your website visitors with a familiar and comfortable messaging experience. Explore the possibilities and enhance your website's functionality by installing Boei today.

After installing FB messenger, consider adding WhatsApp Business and Instagram Business.

FAQ

How do I enable Messenger on my business page?

You can enable Messenger on your business page by visiting your Page Settings. Click on the "Settings" at the top right corner of your Facebook page, then navigate to "General". Here, find "Messages" and edit it. Check the box that says "Allow people to contact my Page privately by showing the Message button". Don't forget to save changes.

Why is my Facebook chat plugin not showing up?

If your Facebook chat plugin isn't showing up, there could be a few reasons. Firstly, ensure that you've correctly installed the plugin code onto your website. Also, check your page settings to make sure the Messenger platform is enabled. If you're still facing issues, it might be due to browser-specific problems like cache or extensions. Try opening your website in an incognito or private browsing window to see if the chat plugin appears.

How do I get my business Messenger link?

Your business Messenger link is a URL that directs users straight to your Messenger chat. It follows the format: "https://m.me/YourPageUsername". If you haven't set a username for your Facebook Page yet, you can do this in your Page Settings. After setting your username, replace "YourPageUsername" with your actual username to get your business Messenger link.

Can you use Facebook Messenger on website?

Yes, absolutely! You can easily install Facebook Messenger on any website to offer live chat service to your visitors. Boei offers a simple and free plugin that allows you to add Facebook Messenger to your website in no time.

How do I get Facebook Messenger on my website?

To get Facebook Messenger on your website, you can install the Boei plugin that allows you to add the chat widget effortlessly. Just follow a few simple steps, customize your chat plugin, and paste the Facebook Messenger chat widget code into your website.

Can I open Facebook Messenger in browser?

Certainly! You can use the chat service via Facebook Messenger on your website without needing to install the Messenger app on their phone. All you need is a browser to start a chat with your business.

Is Messenger and Facebook Messenger the same thing?

Yes, they are the same. Facebook Messenger, often referred to simply as Messenger, is a live chat app that comes integrated with Facebook and can be used for both personal and business communication.

How can I open Facebook Messenger without the app?

You can use Facebook Messenger on your website, thanks to live chat services like Boei's plugin. No need to download the Messenger app on your phone; you can just visit the website and start a chat via Facebook Messenger.

How do I add Messenger chat to my HTML website?

If you're looking to add live chat to your HTML website, Boei's widget for websites makes it simple. We show you how to add the chat widget by generating a chat widget code that you can easily embed in your website's HTML.

Where can I get Facebook Messenger link?

The Boei plugin will generate a unique Facebook Messenger link that you can embed into your website. This link allows anyone who visits your website to chat with your business instantly.

Does Facebook have live chat support?

Yes, Facebook does offer live chat support via its Messenger service. You can enhance your customer support by installing Facebook Messenger on your website through the Boei plugin.

Conclusion

Following these steps, your Messenger chat plugin should be fully operational, inviting more site visitors to engage with your business in real time.

From maintaining an ongoing dialogue to boosting your conversion rates, the benefits of adding a Facebook Messenger button to your web pages are numerous.

Happy chatting!

Article by

Ruben Buijs

Ruben, the founder of Boei, leverages over a decade of consultancy experience at Ernst & Young to optimize lead generation. Boei specializes in converting website visitors into qualified leads. Outside of work, Ruben is passionate about crossfit and enjoys gaming occasionally.

Read more

How to Set WhatsApp Auto Reply Message: Ultimate Guide 2024

Discover how to set up auto-reply messages in WhatsApp Business App. Use the power of WhatsApp to automate your reply.

Instagram Business Chat: A Complete Guide (2024)

Discover how to leverage Instagram business chat and effectively message customers on this popular social media platform.

Scan Telegram QR code for Telegram web - Scan QR Code (2024)

Master the use of Telegram QR codes with this comprehensive guide, from scanning codes to secure usage and Telegram Web login.

Create your first Boei widget now

Get 20% more conversations and turn them into customers easily.
You don't need take our word for it, just try for free!

URL

https://
https://

Trusted by 10,000+ businesses

Quick 5-min, no code setup

Jordi Ibrahim Dan Renaat Fran Nitesh