How to integrate a Facebook like messenger in your website in one minute.

In this story, I will show you haw to integrate à cloud chat app in your website in afew lines of code. Integration is really simple and fast. chat script looks like Facebook messenger or Linked In messenger and you have the chice wich layout to load : docked or embedded layouts.

To integrate messenger into your website, simply add the url of the script to be loaded in the head tag of the page where you want to show chat. You should also add jQuery, because it is used by the chat application.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
 <script src="https://cluster1.telifoun.com/webapi/en/mqttchat.js?appid=mqttchat-87226030&uf=0"></script>

Now in the body of your page you should add the #mqttchat <div> that will contain chat application. You can choose to load docked chat or embedded chat using the data-layout attribute.

<div id="mqttchat"   
          data-layout="embedded"   
          class="mqttchat-lite" 
          data-user-name="user"
          data-user-surname="1"
          data-user-link=""
          data-user-avatar=""          
          data-user-id="1"
          data-user-gender="0" 
          data-width="950"
          data-height="650"            
     ></div>

That is all, refresh you page and the scriptchat is loaded. You can off course catch chat events and use webhooks to store messages in your database and more ..

For more details and advanced integration please see GitHub Reposatory:

GitHub - medaboub/mqtt-chat-web-demo: Web Chat API . Cloud Chat. Ready Chat . Facebook like…

And MQTT-CHAT documentation :

Welcome