Add Facebook Messenger Chat in WordPress/Elementor

In this tutorial, I’ll show you step by step how to add Facebook Messenger chat in WordPress/Elementor websites.

Let’s get right to it!

Note: the digits in brackets e.g. (00:02) indicate the minutes of that exact explanation in the video so you can easily jump to that section and follow along.

Video: Adding Facebook Messenger Chat in WordPress/Elementor

Set Up Your Facebook Messenger Chat

First things first; log into your Facebook and open the page you manage. 

In the Manage Page section on the left, go to Settings > Messaging, scroll down to the Add Messenger to your website option and click Get Started.

In the next window, you can choose a Language, and under Greeting, you can add a custom message your visitors will see, Save and then click Next (01:00)

In the Setup customer chat window that follows, you can change the font and icon colors, and so on (01:14)

Go to the Next window, where you can add the website domain names where you want to add a chat. You can just go to your website, copy its URL then paste it there and save

When you save, you’re given a code in the section on the right, copy it then hit the Finish button (01:39).

To Read: Create an Instagram Access Token for Elementor with New Instagram API

Add Facebook Messenger Code to Your WordPress Website

The code you just copy is the one you use to integrate your Facebook Messenger caht into your WordPress or Elementor website. 

So after getting your code, go to your WordPress dashboard, under Plugins > Add New (02:07)

In the Add Plugins area search for the Header and Footers plugin, install and activate it (02:23)

After activating your plugin, go to Settings and select the Insert headers and footers option (02:27)

In the Scripts in Footer section, paste the FB Messenger code you copied, then hit the Save button (02:51)

Facebook Messenger Chat in WordPress

When you’re done, go to your website and reload it, and your Facebook Messenger chatbox will show up on your pages (03:06), and when your website visitor clicks on it, they can just sign in with their Messenger details and then start a chat with you.

Video: How to Create a Single Elementor Blog Post Page Template

In closing

That’s how you can easily integrate your Facebook Messenger chat into your WordPress website.

For any questions or comments, let me know in the comments section below. Remember to subscribe to my newsletter and youtube channel for more tips and tutorials.

Also Read. . .

Leave a Comment

Your email address will not be published. Required fields are marked *

Recommended Tools

Hostinger offers premium WordPress hosting for small and medium size websites at an affordable price rated 4.5/5 on Trustpilot


Elementor is the WordPress most popular page builder with over 10 million active users

Get My Free WordPress
Beginner Toolkit

I’ll instantly send you my WordPress Beginner Toolkit (PDF) that comes along with all that you need to know as you start your WordPress web design journey.

Intermediate and advanced WordPress users have found it helpful too.

By joining my list, I promise you’ll never be spammed! 🙂

cropped img of the toolkit

Take your website building skills to the next level with my Elementor Pro Bootcamp