MQTTchat Cloud Web

REST API Tutorials Back to mqtt-chat.com

Search…

MQTTchat Cloud Web

Easy integration. Copy / paste, no code to download or install. You just make a call to an iframe in the location where you want the chat to appear. Basic javascript events and functions are provided.

It only takes a few minutes to install MQTT Chat on your website. Once installed, your users will be able to communicate with each other.
Before you begin
​Register to mqttchat,  add your domain name and activate a subscription that suits you.
 Go to the Settings tab of your  admin panel ​ to get your APP_ID and APP_SECRET. You may need these during installation.
Integration
Add JQuery to the header of your page. If you have already included JQuery skip this step.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
Add MQTTchat script to the header of your page just after JQuery Script.
<script src="https://cluster1.telifoun.com/webapi/en/mqttchat.js?appid=mqttchat-xxxxxxxx&uf=0"></script>
Remember to replace AppId parameter in the script with your domain APP_ID. You can also change language : fr, en or ar.
 In the body of your page, where you want to display MQTT chat,  add #mqttchat div to show docked or embedded layouts.
Docked Layout
Embedded Layout
<div id="mqttchat" 
 data-layout="docked"
 class="mqttchat-default"
 data-user-id="1"          
 data-user-name="name" 
 data-user-surname="surname" 
 data-user-avatar=""
 data-user-link=""
 data-user-gender="0"
 ></div>   
<div id="mqttchat" 
 data-layout="embedded"
 class="mqttchat-default"
 data-user-id="1"          
 data-user-name="name" 
 data-user-surname="surname" 
 data-user-avatar=""
 data-user-link=""
 data-user-gender="0"
 data-width="900"
 data-height="500"
></div>   
Remember to set user informations dynamically from $_SESSION or a database.
That is all. For advanced integration, please consult the complete MQTTchat cloud web documentation.
 You can also read a step by step tutorial that explain MQTT chat cloud web Integration.
Ready Integrations
Some CMSs do not allow direct access to the html code for modification. For this we have developed specific plugins for most famous CSM like WordPress, Joomla etc... We also made an adaptation of MQTT chat code for the client-side Javascript frameworks like Angular, ReactJS and Vue.js.

Quick Start

MQTTchat Android

Last modified 23d ago

Copy link

Outline

Before you begin

Integration