Do you want to add a Messenger button on your WordPress site? Including the messenger button on the website lets your audience easily contact you via live chat/call for any type of pre-sale questions, general inquiries, and after-sale support. This will make communication between you and your potential clients more reliable and can increase the conversions and credibility of your work.
Why Add Messenger Button on your Website?
As you know Messenger is a popular mobile application directly integrated with the most popular social media network Facebook. Therefore, most of the mobile users who browse the internet may have Messenger pre-installed on your smartphones. So, adding its contact button on your WordPress website allows a large number of users to communicate your via live chat/call directly from their mobile phones.
How to Embed Messenger Contact Button on WordPress?
Now let’s get along with the step by step tutorial and add Facebook Messenger contact button on your WordPress website.
We will discuss 2 different ways:
- Using Developer Setup Method
- By using a free WordPress Messenger contact button plugin
The 1st method requires a fair chunk of coding knowledge. So, if you are a technical user with great coding skills, you can carry out this process.
The 2nd method does not require coding. So, this method is feasible for both laymen and coders.
1. Adding Messenger Contact Button Using Developer Setup Method
Step 1: Enter Domain Name on Whitelist Domain
Go to Page Settings >> Messenger Platform >> Customer Chat of your Facebook fan page.
There, enter the domain name of your website.
Step 2: Copy Codes
Then, copy the codes that are generated on the right side of the popup.
Step 3: Add Codes
You need to copy the code on each page where you want to display the Messenger contact button.
Here, we have done on the footer bar.
After you are done, update the file to save the codes.
Then, visit the website to check out how the Messenger button will look.
2. Adding Messenger Contact Button by Using WordPress Plugin
Now let’s talk about adding the Messenger chat button by using the WordPress plugin. The plugin that we will use is Messenger Customer Chat. It is a free WordPress Messenger button plugin developed by the official Facebook developers to place the responsive Messenger button in few clicks.
So, let’s started with the tutorial and display a responsive messenger contact button:
The first thing you do is install and activate Messenger Customer Chat plugin on your WordPress website. To know the detail about the installation, you can check out our article: How to Install a Plugin on your WordPress website
Upon activation, you will see Customer Chat on the left menu of your WordPress dashboard. Click on it to continue.
You will land to the “Messenger Customer Chat Settings” where you can set up the Messenger customer chat button on your website.
Click on “Setup Customer Chat” to proceed.
A new Window will be loaded that will ask to you select the Facebook page of which you want to select the messenger button.
Select the Page and Click on “Continue”.
It will direct you to the “Language” page where you can change the language and greeting text to add your own greeting text.
After you are done, click “Next”.
Then, it will direct you to the “Appearance” page where you can choose the color for your messenger button that matches the overall design of your website.
After you are done, click on “Finish”.
A code snippet containing the codes will be added on the “Messenger Customer Chat Settings”.
For editing your Messenger button, you can always go back through the setup process or edit the code manually.
Now visit your WordPress website to look at how your messenger button will look like.