Facebook Messenger on your Website?

You can now incorporate Facebook Messenger on your website.

Recently Facebook has introduced a Messenger chat application that can be installed on websites. Here at Concise Training, we have been using Purechat as a (paid) chat application for the last 12 months and have seen great success as you can read on our blog.  Therefore we were excited to give the Facebook (free) version a trial on our Concise Digital WordPress website.  Read on to see how we got on.

Installing the plugin

There is a technical way which gives more customisation options but is more complex and there is a quicker, easier way using a WordPress plugin, which provides you with a working chat window in just a few easy steps. We will take you through both options: 

The technical setup

The steps for installing the Facebook Messenger chat functionality on your website are as follows:

Step 1 On your Facebook Page click settings” then Messenger Platform” then Whitelisted Domains” add in the URL of the website that will feature the chat window E.G. https://concisedigital.net This must be an HTTPS:// (secure) domain.

Step 2 Add the Facebook SDK (development kit) to your website by inserting some code to every page that you wish to use the chat window on. There are further instructions for this step here.

Step 3 Add code for the chat window itself to the page where you want the chat window to appear. There are various ways you can customise the code to change the way the chat window appears and behaves. If you are technically minded you can read about these here.

Using a WordPress Plugin

There are a couple of WordPress plugins that will do some of the technical work for you. The steps that you still need to follow are more straightforward to complete than above:

Step 1 As with the above method start on your Facebook Page click settings” then Messenger Platform” then Whitelisted Domains” add in the URL of the website that will feature the chat window E.G. https://concisedigital.net This must be an HTTPS:// (secure) domain.

Steps om how to add the Facebook Messenger using a WordPress plugin.

Step 2 Install the WordPress plugin by logging in to WordPress then choosing plugins” then add new”. The plugin that we used is called Customer Chat for Facebook and it is by Sam Carlton.

Step 3 Configure the plugin settings.

Plugin Settings

The plugin settings are very straightforward to complete. First, you need to enter the numerical ID of your Facebook page. If you don’t know the numerical ID but you know the Facebook Page URL you can use this useful online tool to find the ID number.

The second part of the settings involves creating a Facebook App. This is actually quite straightforward and there is a helpful link within the settings page that will take you to the Facebook Developers site (you need to be logged in to Facebook to access it).

Once here, you need to:

Add a new App

Name it and click Create new App ID

To add Facebook Messenger, part of the process is creating a Facebook App.

On the next screen copy the APP ID from the top left-hand corner

Adding Facebook Messenger to your website will offer some great benefits.

Paste the App ID into the WordPress plugin settings box:

One of the steps to add Facebook Messenger to your website is to paste the App ID into the settings box.

Then you can choose whether you want the chat window to start open or minimised and select your language.

Save the settings and that is it done!

Check to see if it works

When you visit your site you should now see the chat window available.  Note that visitors have to log in using their Facebook credentials when they click the chat now” button for us, this is a big disadvantage of using Facebook chat as opposed to Purechat but it will depend on your audience.

You should now see the Facebook Messenger chat window appear on your website.

The Chat Experience

From the website visitor’s point of view they see the chat box on your website:

The Facebook Messenger chat experience.

From the Facebook Page’s point of view the chat appears just as any other Facebook Chat in Messenger (the desktop version is shown):

The web chat just appears like any other Facebook Messenger chat.

Summary

Advantages

  • It is free to use!
  • If you use the WordPress plugin to add the Facebook Chat to your website it is really quite straightforward to get it working.
  • The chat experience for the website user is exactly as it is on Facebook Messenger only with some basic functionality and minimal emojis etc.
  • The experience for the Facebook page owner is just like having any other Messenger conversation and they can send emojis, attachments, links etc very easily.
  • Once a visitor starts a Facebook Messenger conversation with a business, the business can then make use of Messenger advertising to retarget the visitor
  • An administrator of the Facebook Page can answer the message.  With paid chat applications, only users who have a login to the application can answer.

Disadvantages

  • Visitors need to be logged in to Facebook to be able to use the chat functionality
  • The chat functionality is always on.  Paid chat applications have the options to offer email support outside office hours.
  • If the website user wants to make use of normal Messenger extras such as attachments they will need to click in the menu to take the conversation across to Facebook which will take the visitor away from your website
  • Facebook may track private messengers 

We are impressed with the functionality and will continue to use the Facebook Messenger app on our Concise Digital website for now.  However, the fact that you have to be on Facebook to use the chat could be a potential issue for our training prospects so we will continue to use PureChat for now.

Let us know in the comments are you going to use chat functionality on your website?  Which option will you choose?

Share this:

Leave a Reply

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


Please note this comment form uses 3 cookies to store your name, email address and (if you enter one) website address, simply so that you do not have to re-enter this information if you comment again.Using this form constitutes acceptance of these cookies. More cookie information on our Cookies Info page.