Як додати AI чат-бот Asyntai до Webflow

Покрокова інструкція для сайтів Webflow

Платформа:

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

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

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

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

Крок 2: Додайте код через налаштування сайту (всі сторінки)

Щоб додати чат-бот на всі сторінки вашого сайту Webflow одразу:

Увійдіть до свого облікового запису Webflow та виберіть свій проєкт
Натиснiть на значок шестерня (Налаштування сайту) на лiвiй бiчнiй панелi
Натисніть на "Custom Code" в меню налаштувань
Прокрутiть вниз до роздiлу "Footer Code" (перед тегом </body>)
Вставте ваш код для вставки Asyntai
Натисніть "Save Changes"
Опублікуйте свій сайт, щоб зміни набули чинності

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

Альтернатива: Користувацький код для конкретної сторінки

Якщо ви хочете чат-бот лише на конкретних сторінках:

Відкрийте свій проект у Webflow Designer
Натиснiть на панель сторiнок (значок папки) на лiвiй бiчнiй панелi
Наведіть курсор на сторінку, яку хочете редагувати, та натисніть на значок шестірні
Прокрутіть вниз до "Custom Code"
Вставте код вбудовування Asyntai в роздiл "Before </body> tag"
Натисніть "Save"
Опублікуйте свій сайт

Альтернатива: Використання елемента Embed

Ви також можете додати чат-бот за допомогою елемента Embed будь-де на вашiй сторiнцi:

Відкрийте свій проект у Webflow Designer
Натисніть кнопку "+", щоб відкрити панель додавання
Шукайте "Embed" або знайдіть його в розділі Components
Перетягніть елемент Embed на вашу сторінку
Вставте ваш код вбудовування Asyntai в редактор коду
Натисніть "Save & Close"
Опублікуйте свій сайт

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

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

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