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 MQTTChat 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/rest/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 MQTTchat, add #mqttchat div to show docked or embedded layouts.

Docked Layout
Embedded Layout
Docked 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>
Embedded Layout
<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 MQTTchat 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 MQTTchat code for the client-side Javascript frameworks like Angular, ReactJS and Vue.js.