Онлайн-чат на сайте — подключение и проверка

Виджет — это та же воронка, что и в мессенджерах, но прямо на вашем сайте. Отдельный бот и токен не нужны: чат работает от проекта.

Что нужно заранее

  • Активный проект ImpactBot и опубликованная воронка с триггером на входящее сообщение — иначе кнопка появится, а отвечать будет некому.
  • Доступ к шаблону сайта, чтобы вставить пару строк перед закрывающим `</body>`.
  • ID проекта. Набирать его руками не нужно: сниппет копируется кнопкой уже с подставленным значением.

Слот канала в тарифе виджет не занимает — это не бот, а публичный вход в проект.

Права и доступы

Токенов и OAuth здесь нет: посетитель сайта анонимен, сессия чата выдаётся ему автоматически и живёт сутки.

Единственная настройка доступа — список разрешённых доменов (Проект → «Каналы» → блок виджета). Пока список пуст, чат отвечает любому сайту, куда скопировали сниппет, — и мы про это пишем прямо, а не умалчиваем. Как только в списке появился хотя бы один адрес, запросы с других доменов получают отказ `origin_denied`. Формат записи: точный домен (`shop.ru`), адрес со схемой (`https://shop.ru`) или маска поддоменов (`*.shop.ru`); маска вида `*.ru` отклоняется как «весь интернет с видом настройки безопасности». Больше 20 адресов не хранится.

Правит список тот, кто вправе менять настройки проекта.

Подключение и вебхук

  1. Проект → Каналы → блок виджета → Код виджета → скопируйте сниппет кнопкой.
  2. Вставьте его перед закрывающим `</body>`: в обычном сайте — в общий шаблон страницы, в Tilda — блок T123 «HTML-код» либо Настройки сайта → Ещё → HTML-код внутрь body, в WordPress — в footer темы или через плагин вставки скриптов.

Минимальный вариант выглядит так:

<script>
window.ImpactBotConfig = { projectId: "ваш-id-проекта" };
</script>
<script src="https://api.impactbot.ru/api/widget/loader.js" async></script>

Здесь вебхук не нужен — и это не упрощение, а устройство канала: скрипт сам открывает сессию и сам забирает ответы, встречного адреса на вашей стороне не существует и настраивать нечего.

Внешний вид задаётся тем же объектом: `color` (hex кнопки), `position` (`right` или `left`), `greeting` (подпись у кнопки), `botName`, `avatar`, `offsetBottom` и `offsetSide` (отступы в пикселях). Значения по умолчанию — синяя кнопка справа с подписью «Напишите нам».

Оценка диалога включается отдельно: Каналы → Widget Studio → виджет «Онлайн-чат» → вкладка Настройка → «Качество ответа». Вопрос появляется в ленте чата, когда разговор затих, спрашивается один раз за сессию, а настройки студии применяются только после Публикации — черновик посетителям не отдаётся.

Проверка

Откройте свою страницу в новой вкладке: в углу должна появиться круглая кнопка чата. Напишите в неё — ответить должна опубликованная воронка, а в проекте появиться новый клиент и диалог в разделе «Диалоги». Оценки, если вы их включили, видны на вкладке Аналитика виджета: среднее, число оценок и распределение по баллам.

Если кнопки нет, откройте консоль браузера: загрузчик пишет туда `[ImpactBot] projectId not set in window.ImpactBotConfig`, когда сниппет вставлен без идентификатора.

Частые ошибки

  • Кнопка не появилась. Код вставлен вне `<body>` или конструктор сайта вырезал скрипты — посмотрите исходный код готовой страницы.
  • В консоли «projectId not set». Скопирован только второй тег `<script>`, без объекта `window.ImpactBotConfig`.
  • Виджет есть, бот молчит. Воронка не опубликована либо в ней нет триггера на входящее сообщение.
  • Ответ `origin_denied` в сети. Домен сайта не внесён в список разрешённых — добавьте его точно в том виде, в каком он в адресной строке.
  • Скопирован чужой ID проекта. Сообщения уходят в другой проект: возьмите сниппет из нужного.
  • Настройки студии не применились. Виджет не опубликован после правок.
  • Чат не открывается на мобильном. Другой скрипт на сайте перехватывает клики или перекрывает кнопку по z-index.