Сайт и конверсииВеб-виджет · 5 мин

Как установить веб-виджет AI Chatbot Platform на сайт и проверить работу без разработчика

Инструкция по включению виджета, настройке внешнего вида, генерации embed-кода и установке скрипта на сайт с последующей проверкой диалога и бронирования.

Открыть полное руководство

Когда использовать

Подойдёт для лендингов, корпоративных сайтов, интернет-магазинов и внутренних порталов, где нужен быстрый запуск консультанта в один скрипт.

Что подготовить до подключения

Чат-бот уже создан и сохранён в проекте.
У вас есть доступ к HTML сайта, CMS или шаблону, куда можно вставить JavaScript-код.
Если хотите принимать записи через виджет, заранее включите услуги и расписание в модуле бронирования.

Пошаговая инструкция

1. Настройте внешний вид виджета

Откройте проект, выберите чат-бота и перейдите в раздел «Интеграции» -> «Веб-виджет».
Включите виджет, задайте заголовок, позицию, цвет и при необходимости загрузите собственную иконку.
Выберите, должен ли виджет открываться сразу и сколько диалогов хранить у посетителя.

2. Подготовьте пользовательский сценарий

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

3. Сгенерируйте embed-код

В том же блоке откройте секцию генерации кода.
Нажмите кнопку показа кода и скопируйте готовый snippet.
Используйте только актуальный код из текущего чат-бота, чтобы не подключить не тот проект.

4. Установите скрипт на сайт

Вставьте snippet перед закрывающим тегом </body> на всех страницах, где нужен виджет.
Если у вас CMS, добавьте код в глобальный шаблон, раздел пользовательских скриптов или footer-блок.
Опубликуйте изменения и очистите кэш сайта, если он включён.

5. Проверьте поведение на сайте

Откройте сайт в режиме инкогнито и дождитесь появления кнопки виджета.
Напишите тестовое сообщение и убедитесь, что ответ приходит от нужного чат-бота.
Если бронирование активно, проверьте, что посетитель может перейти к записи, выбрать слот и отправить данные.

Чек-лист после запуска

Виджет открывается на сайте в выбранной позиции и с заданным цветом.
Диалог создаётся именно в вашем проекте, а не в другом тестовом чат-боте.
Snippet можно переиспользовать в статьях и инструкциях, потому что он уже включает ID чат-бота и API URL.

Частые вопросы

Куда лучше вставлять код, если сайт на Tilda, WordPress или другой CMS?

Вставляйте snippet в глобальный footer, в раздел пользовательского кода или в общий шаблон страниц. Главное правило одно: скрипт должен загружаться перед закрывающим тегом </body>.

Можно ли сначала протестировать виджет, а потом публиковать на весь сайт?

Да. Сначала сохраните настройки, откройте встроенный предпросмотр и поставьте snippet на тестовую страницу. После проверки перенесите тот же код на все боевые страницы.