Code Snippets
Code Snippets
With snippets below you can extend widget's functionality. Here are a few examples on how to use our Tidio Widget API.
Open chat widget on link click
To do this you need to add an attribute to link as shown in the code below.
<a href="#" onclick="tidioChatApi.open()">Open chat!</a>
Load chat widget after a while
The script below will allow loading the widget with a certain delay (5 seconds by default).
setTimeout(function () {
var tidioScript = document.createElement('script');
tidioScript.src = '//code.tidio.co/PUBLIC_KEY.js';
document.body.appendChild(tidioScript);
}, 5 * 1000);
Open widget after load
The script below will make the chat appear fully expanded as soon as it loads on your site.
(function () {
function onTidioChatApiReady() {
window.tidioChatApi.open();
}
if (window.tidioChatApi) {
window.tidioChatApi.on('ready', onTidioChatApiReady);
} else {
document.addEventListener('tidioChat-ready', onTidioChatApiReady);
}
})();
Widget language
If you have multilanguage site and want to widget match site's langauge you can set it by document.tidioChatLang
property.
Set language from html attribute
Script gets language from html lang
attribute and write it to document.tidioChatLang
variable.
document.tidioChatLang = document.querySelector('html').getAttribute('lang');
Set language with other variable
If you want to display chat only in one language or you have it in another place please use the snippet below.
document.tidioChatLang = 'es';
Updated 5 months ago