Як додати ШI-чатбот Asyntai до Concrete CMS

Покрокова інструкція для сайтів Concrete CMS (раніше Concrete5)

Платформа:

Крок 1: Отримайте код для вставки

Спочатку перейдіть до своєї панелі керування Asyntai і прокрутіть вниз до розділу "Код вбудовування". Скопіюйте свій унікальний код вбудовування, який виглядає так:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Примітка: Код вище є лише прикладом. Ви повиннi скопiювати власний унiкальний код для вставки з вашої Панелi керування, оскiльки вiн мiстить ваш особистий ID вiджета.

Крок 2: Додайте код до нижнього колонтитула теми (Рекомендовано)

Найкращий спосiб додати чатбот на всi сторiнки вашого сайту Concrete CMS - вiдредагувати файл нижнього колонтитула теми:

Отримайте доступ до вашої установки Concrete CMS через FTP або Файловий менеджер
Перейдіть до каталогу /application/themes/your_theme_name/
Знайдiть та вiдкрийте файл footer.php (або еквiвалентний шаблон нижнього колонтитула)
Знайдіть рядок із закриваючим тегом </body>
Вставте ваш код для вставки Asyntai безпосередньо перед тегом </body>
Збережіть файл та завантажте його назад на сервер, якщо редагуєте локально
Очистіть кеш Concrete CMS: Dashboard → System & Settings → Clear Cache

Порада: Додавання коду перед закриваючим тегом </body> забезпечує завантаження чатбота пiсля вмiсту сторiнки, що покращує продуктивнiсть завантаження. Цей метод автоматично додає чатбот на кожну сторiнку, що використовує цю тему.

Альтернативний метод 1: HTML-блок (Найпростіший для не-розробників)

Якщо ви не бажаєте редагувати файли теми, ви можете використовувати вбудований HTML-блок Concrete CMS:

Увійдіть до вашої Панелі керування Concrete CMS
Перейдіть на сторінку, де ви хочете додати чатбот
Натисніть Edit Page (значок олівця на панелі інструментів)
Натисніть Add Block в області, де ви хочете розмістити код
Знайдіть та оберіть блок HTML
Вставте ваш код для вставки Asyntai в HTML-редактор
Натисніть Add, щоб зберегти блок
Натисніть Publish, щоб зміни стали активними

Примітка: Метод HTML-блоку чудово пiдходить для додавання чатбота на конкретнi сторiнки. Для встановлення на весь сайт вам потрiбно додати HTML-блок на кожну сторiнку або використовувати метод нижнього колонтитула теми, описаний вище. Вiзуальне розмiщення блоку не впливає на те, де з'являється чатбот - вiн все одно буде показуватися в правому нижньому кутi.

Альтернативний метод 2: Файл заголовка теми

Ви також можете додати код до файлу заголовка вашої теми для встановлення на всьому сайті:

Отримайте доступ до файлів Concrete CMS через FTP або Файловий менеджер
Перейдіть до /application/themes/your_theme_name/
Відкрийте файл header.php (або elements/header.php)
Знайдіть закриваючий тег </head>
Вставте код вбудовування Asyntai безпосередньо перед тегом </head>
Збережіть та завантажте файл
Очистіть кеш з панелі керування

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>
</head>

Порада: Переконайтеся, що ви включили необхiднi елементи заголовка за допомогою <?php View::element('header_required'); ?> у вашому файлi header.php для коректної роботи Concrete CMS.

Альтернативний метод 3: Власний шаблон (Розширений)

Для розробникiв, якi хочуть бiльше контролю, можна створити власний шаблон сторiнки:

Створiть новий файл шаблону сторiнки в /application/themes/your_theme_name/
Або скопiюйте iснуючий шаблон (наприклад, default.php) та перейменуйте його
Додайте код вбудовування Asyntai до файлу шаблону перед </body>
У Панелі керування Concrete CMS перейдіть до Pages & Themes
Натисніть на Page Types
Виберіть тип сторінки, з яким ви хочете використовувати цей шаблон
Призначте свій власний шаблон типу сторінки
Усі сторінки, що використовують цей тип сторінки, тепер містимуть чат-бот

Важливо: Завжди створюйте резервну копiю файлiв теми перед внесенням змiн. Якщо можливо, спочатку протестуйте змiни на тестовому сайтi. Некоректнi змiни у файлах теми можуть порушити макет або функцiональнiсть вашого сайту.

Крок 3: Перевірте встановлення

Пiсля внесення змiн та очищення кешу вiдкрийте свiй веб-сайт у новiй вкладцi браузера або в режимi iнкогнiто. Ви повиннi побачити кнопку чат-вiджету в нижньому правому кутi. Натиснiть на неї, щоб переконатися, що вона вiдкривається та працює коректно.

Не бачите віджет? Переконайтеся, що ви очистили кеш Concrete CMS (Dashboard → System & Settings → Clear Cache). Спробуйте переглянути сайт у режимi iнкогнiто. Перевiрте, що ви зберегли та завантажили всi змiни файлiв. Вiдкрийте консоль браузера (F12), щоб перевiрити наявнiсть помилок JavaScript.