In this Post I will show you with concrete example how to integrate MQTT CHAT Cloud WEB in your Website.
Suppose that you have a website with URL : https://www.domain.com/, The domain name of website is domain.com.
1- Register to MQTT-CHAT admin Panel : https://panel.matt-chat.com then Verify your email address.
2- Add your domain to MQTT-CHAT, and choose a subscription that suits to you like below:
In our case we choose free trial subscription. Then we click on Add Domain button. Activating the subscription takes 2 or 3 seconds. Subscription status will change from wait_activation to active.
3- Click on subscription actions menu then click on Open Dashboard.
4-Go to Settings/Credentials rubrique on Dashboard left menu. You will see Authentication Settings : APP ID and APP Secret , you need them during installation.
5- Integrate MQTT-CHAT in Your website:
Add JQuery and MQTT-CHAT loading script URL on the <head> tag of the page where you want to show chat application.
D’ont forget to change appid parameter with APP ID setting of your domain seen in step before.
`<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-ruM3F9JJ&uf=0"></script>
In the <body> of your page, where you want to display MQTT CHAT, add #mqttchat div to show docked layout.
<div id="mqttchat"
data-layout="docked"
class="mqttchat-lite"
data-user-name="user"
data-user-surname="surname"
data-user-link=""
data-user-avatar=""
data-user-id="1"
data-user-gender="0"
></div>That is all. Normally chat will load after page refresh.
For more details and advanced integration, please see documentation:
