Перейти к основному контенту

Создание виджета для сторонних сайтов

Раздел «Чат-боты» позволяет создавать и размещать ботов на сторонних сайтах или в мессенджерах.
Для работы на сайте используется тип бота «Виджет». Он встраивается в HTML-код страницы и взаимодействует с посетителями через всплывающее окно чата.

1. Как открыть раздел

image.png

  1. Перейдите в левое меню платформы.

  2. Откройте раздел «Чат-боты».

  3. Нажмите кнопку «Добавить чат-бота» в правом верхнем углу.

image.png

Откроется модальное окно создания бота.

2. Шаг 1. Основные параметры

image.png

Заполните поля:

  • Название — будет отображаться в списке чат-ботов.

  • Описание — кратко опишите назначение бота, например: «Консультирует по услугам центра».

  • Тип бота — выберите «Виджет» из выпадающего списка.

По умолчанию выбран тип Telegram. Для создания Telegram-бота см. отдельную инструкцию.

Нажмите «Далее», чтобы перейти к настройкам.

3. Шаг 2. Настройки бота

image.png

На этом шаге задаются параметры работы бота.

  • Имя бота — имя, которое будет отображаться пользователям в чате как отправитель сообщений.

  • Подключение сценария к боту — выберите сценарий и стартовый блок. Подключить сценарий можно и позже через окно редактирования.

  • Параметры диалога — установите максимальное время диалога.
    Это время, после которого сессия автоматически завершается и отображается в аналитике (по умолчанию — 12 часов).

После заполнения нажмите «Добавить чат-бота и сгенерировать код».

4. Получение и размещение кода

После сохранения система автоматически сгенерирует HTML-код для вставки виджета на сайт.image.png

Как вставить код:

  1. Скопируйте код, нажав «Копировать код».

  2. Вставьте его перед закрывающим тегом </body> в HTML-коде страницы сайта.

  3. Сохраните изменения на сайте.

5. Проверка работы и взаимодействие с пользователем

После добавления виджет будет отображаться на сайте как всплывающее окно чата.
Пользователи смогут общаться с ботом в реальном времени.

image.png

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

image.png

6. Редактирование и удаление чат-бота

image.png

  • Чтобы изменить настройки, нажмите иконку шестерёнки ⚙️ в списке чат-ботов.
    Откроется модальное окно настроек.

    image.png

  • Здесь можно:

    • изменить название, описание, сценарий или имя бота;

    • сгенерировать новый код вставки;

    • удалить бота с помощью кнопки «Удалить чат-бота».

Настройка доступна только пользователям, имеющим права на создание и редактирование чат-ботов.

7. Список чат-ботов

image.png

В списке отображаются все созданные чат-боты проекта.
Для каждого указываются:

  • Название и тип (Telegram или Виджет);

  • Статус подключения;

  • Сценарий, с которым связан бот.

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

8. Пример использования

Виджет-бот можно разместить:

  • на главной странице сайта компании — для консультаций посетителей;

  • на странице обратной связи — для записи на приём или оформления заявки;

  • в интернет-магазине — для помощи при выборе товара.

Наверх