Webchat Script
Customise the display of a Webchat popup on a webpage.
The Webchat popup is embedded into webpage bodies with the script provided in its settings.
These Javascript commands control the popup in various ways:
window.yola.open()
Opens the popup
window.yola.close()
Closes the popup
window.yola.hide()
Hides both the toggle button and popup
window.yola.show()
Shows both the toggle button and popup
window.yola.startchat()
Starts a chat
window.yola.isOpen()
Checks if the popup is open
window.yola.hideToggleButton()
Hides the toggle button
Check Toggle State
To check if the popup is open or closed, you can also use the following code:
<script type="text/javascript">
window.yolaSettings = {
id,
...
onOpen: () => console.log('Webchat opened'),
onClose: () => console.log('Webchat closed'),
};
</script>
Hide Toggle Button
A showToggleButton
property can keep the popup toggle button permanently hidden:
<script type="text/javascript">
window.yolaSettings = {
id: '',
showToggleButton: false
onInit: function () { }
};
var prs = document.createElement('script');
prs.src = 'https://embed.yola.ai/index.umd.js';
prs.type = 'text/javascript';
prs.async = true;
prs.onload = function () {
window.yola.init(window.yolaSettings);
};
document.head.appendChild(prs);
</script>
Identify a Player
To send your audience member's custom ID to Yola so they are correctly created—or matched with an existing one—add a new line with the ID as shown below.
<script type="text/javascript">
window.yolaSettings = {
id: 'CHANNEL ID',
onInit: function () {
window.yola.identify('YOUR CUSTOM ID');
},
};
var prs = document.createElement('script');
prs.src = 'https://embed.yola.ai/index.umd.js';
prs.type = 'text/javascript';
prs.async = true;
prs.onload = function () {
window.yola.init(window.yolaSettings);
};
document.head.appendChild(prs);
</script>
If you're using API to register players in Yola, make sure the ID in the snippet exactly matches the format of the one you're sending via API. A new player is created if the IDs are not a precise match.
Make sure to only send the window.yola.identify('')
line when the player is authenticated on your website and the ID is not empty. If the player is not authenticated and/or you don't have their ID, this line should not be included or will send an empty ID value. All players with an empty ID will be identified as the same player.
If you wish to reset a previously identified user, add window.yola.reset()
to the script.
Last updated
Was this helpful?