How to Integrate Facebook Messenger to your website

Pulse Chat
Chatbots Life
Published in
4 min readNov 17, 2017

--

Messenger for Business is an excellent tool for instantaneous contact and connection with prospects and customers.Facebook messenger is the most used way nowadays to reach anyone at anytime. It is used by many customers to reach business organisations and there are many valid reasons to do so. Personalized touch provided by the platform to each customer is one of the key reasons.

Currently, there are 3 ways which could be used to include Facebook Messenger in your website.

1. Facebook Messenger Link

You can render the Facebook Messenger Button using Javascript or HTML. Using this along with HTML will make the button visible to the user even if he blocks ads, which is advantageous. This will redirect you to the messenger.com opening up a chat with the relevant business.

its just a matter of adding your messenger link like this,

Html snippet to include Messenger link in your website

Basically m.me/YourFacebookPageId which can be either a customized name like above snippet or a numeric Id which is automatically generated by Facebook.

2. Facebook Messenger Button

This button which is only available for Facebook page owners to receive which will allow one to message to personal profiles as well. This requires a bit of Javascript and HTML to be embedded in to the website and then it is as simple as adding the Facebook page Id. Further, this will allow you to customize the button as desired.

Customizable Messenger buttons that can be included in your website

3. Facebook Messenger Box

This allows users to interact with the particular business from the website itself. Allows to type in a message in the box similar to which you see in Facebook from the website itself.

How Facebook Messenger box looks like in a website

Although some websites allow you to type in your messages currently on their website (using any of the above mentioned methods), they do not provide you with the context aware conversation support, which you get when you chat on the Facebook page. It has the capability to send a message to the relevant Facebook page but doesn’t have the capability to identify you and provide that same experience.

How cool will that be if the business organization is able to remember you, regardless whether you are chatting via their Facebook page or their website?

So what’s new?

Facebook announced their all new Customer Chat Plugin (beta) which will facilitate the customers to continue their chats with that particular business’s website. You don’t need to spend time going back to the Facebook page from the website while you are on the website, alternatively, you can continue the old conversation right from where you are.

So let us have a look, how you can add this newest addition, Customer Chat Plugin to your website, what are it’s benefits and limitations.

This chat plugin is capable of allowing your customers witness the same rich content experience just like they do in messenger app. Furthermore, this will load the chat history of that particular customer. The customer experience will be enhanced by a seamless conversation between the business and the customer is carried out, the customer does not see a difference in chatting with the business via messenger or using the website.

All kinds of messages and templates are allowed to be typed in just as you type in Messenger application or Messenger.com.

Currently, this feature is only available to a few developers since it is yet a closed beta release. But Facebook allows you to pre-sign-up and get notified when this plugin is available for public usage.

The next question which pops up when talking about this kind of a plugin is about the browser support. Except for in app browsers and Internet Explorer, all the other browsers do support this feature on a website.

So how can this plugin be included on your website, Are there any prerequisites?

The Facebook JavaScript SDK, which provides a rich set of client-side functionality, must be included on the page where the plugin will be rendered. It is as simple as including a JavaScript snippet in your HTML where the plugin will be rendered.

We at Pulse Chat are very excited with the benefits this plugin will bring about in providing the customers a better and seamless user experience. This will also increase the traffic to the business website on which this is rendered. And reasoning from this fact, the customers will engage more with the website and will be easy for them to have everything in a single place.

--

--

A cloud based Chat bot solution specifically designed for automotive dealerships. Pulse can be used to manage interactions on Facebook Messenger.