Register to MQTT chat, 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.
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 MQTT chat script to the header of your page.
<script src="https://cluster1.telifoun.com/rest/en/mqttchat.js?appId=mqttchat-xxxxxxxx&uf=0"></script>
Get User Informations.
<?php$user = JFactory::getUser();if (!$user->guest) {$mqttchat_user_id= $user->id;$mqttchat_user_name= $user->name;$mqttchat_user_surname=$user->username;//...}?>
Show Chat Layout : In the body of your page, where you want to display MQTT chat, add #mqttchat div to show docked or embedded layout.
<div id="mqttchat"data-layout="docked"class="mqttchat-default"data-user-id="<?=$mqttchat_user_id?>"data-user-name="<?=$mqttchat_user_name?>"data-user-surname="<?=$mqttchat_user_surname?>"></div>
<div id="mqttchat"data-layout="embedded"class="mqttchat-default"data-user-id="<?=$mqttchat_user_id?>"data-user-name="<?=$mqttchat_user_name?>"data-user-surname="<?=$mqttchat_user_surname?>"data-width="900"data-height="500"></div>