Эта статья поможет вам настроить виджет так, чтобы он появлялся только на определенных страницах вашего сайта. Эта опция полезна для пользователей, которые имеют доступ к коду сайта и хотят полностью контролировать, где будет отображаться виджет.

Как отобразить виджет на определенных страницах

Идея этого процесса проста. Если ввести URL-адрес внутри кода, Tidio будет виден только на настроенных страницах. Он будет скрыт в любом другом URL-адресе, который не соответствует определенной ссылке.

Давайте посмотрим пример:

Мы добавили в код URL: http://mystore.com/products/black/ . В этом случае виджет будет отображаться на всех URL-адресах, содержащих эту фразу.

Виджет не появится в:

  • http://mystore.com/about
  • http://mystore.com/contact
  • http://mystore.com/blog

Но оно появится в:

  • http://mystore.com/products/black/
  • http://mystore.com/products/black/shoes
  • http://mystore.com/products/black/accessories

код

Чтобы реализовать этот вариант, выполните следующие действия:

  1. Этот код должен загружаться после скрипта, поэтому размещайте его ниже кода JavaScript Tidio или над кодом Tidio.</body> Если вы используете плагин Tidio.

  2. Скопируйте и вставьте код ниже или найдите его на нашей странице Codepen .

Если у вас есть дополнительные вопросы, отправьте сообщение в нашу службу поддержки по адресу support@tidio.net.

<script async src="https://code.tidio.co/fouwfr0cnygz4sj8kttyv0cz1rpaayva.js"></script>
<script>
(function() {

// שנה כתובות URL מורשות כאן
var whitelistedUrls = [
'http://tidio.com',
];
// אל תשנה את הסקריפט לאחר שורה זו 


var shouldShowWidget = (function isCurrentUrlWhitelisted() {
var currentUrl = window.location.href;
var isWhitelisted = false;
whitelistedUrls.forEach(url => {
if (currentUrl.indexOf(url) > -1) {
isWhitelisted = true;
}
})
return isWhitelisted;
})();

function onTidioChatApiReady() {
if (shouldShowWidget) {
window.tidioChatApi.show();
}
else {
window.tidioChatApi.hide();
}
}
if (window.tidioChatApi) {
window.tidioChatApi.on('ready', onTidioChatApiReady)
} 
else {
document.addEventListener('tidioChat-ready', onTidioChatApiReady);
}
})();
</script>