msg8
Открыть приложение →

Установка виджета на сайт

Для установки нужен один фрагмент кода. На конструкторе его обычно можно добавить в настройках, а на самописном сайте — передать разработчику. Платформа должна разрешать выполнение стороннего JavaScript в основной странице сайта.

После нового онбординга

После сохранения агента откроется установка с коротким списком действий. Код можно поставить, пока агент изучает сайт. Выберите платформу; если её нет в списке или вы не знаете название, оставьте «Любой сайт / не знаю платформу». Код и пошаговую инструкцию можно скачать и передать разработчику.

После установки кода и публикации сайта виджет сразу начнёт работать. Отдельно включать показ не нужно. Чтобы проверить подключение, нажмите «Проверить установку», затем «Открыть сайт для проверки». Адрес можно указать без https://, например example.com. msg8 ждёт сигнал от установленного кода, поэтому само копирование не подтверждает установку.

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

Шаг 1. Скопируйте код установки

В дашборде нажмите «Установить на сайт» (кнопка в Песочнице) или откройте Настройки → Встраивание. Скопируйте сниппет — в нём уже подставлены ключ вашего проекта и идентификатор агента:

<script>
(function(){if(!window.Chatbot){window.Chatbot=function(){(window.Chatbot.q=window.Chatbot.q||[]).push(arguments)};window.Chatbot.q=window.Chatbot.q||[]}var s=document.createElement("script");s.src="https://widget.msg8.ai/widget/loader.min.js";s.async=true;s.dataset.key="ВАШ_КЛЮЧ_ПРОЕКТА";s.dataset.agent="идентификатор-агента";(document.head||document.documentElement).appendChild(s);})();
</script>

💡 Копируйте код именно из дашборда — там значения data-key и data-agent уже заполнены под ваш проект и агента.

Окно с кодом установки в дашборде msg8

Шаг 2. Вставьте код на сайт

Добавьте код один раз в общий шаблон всех нужных страниц перед </body> или в поле общего пользовательского кода платформы. Код можно размещать и в <head>, если так устроена платформа. Обычный HTML-блок или iframe не всегда подходит: он может не выполнять JavaScript либо ограничить виджет рамками блока.

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

Tilda

Откройте Настройки сайта → Ещё → HTML-код для вставки внутрь HEAD. Нужны именно настройки сайта, чтобы код появился на всех страницах. Добавьте код целиком, сохраните и опубликуйте все страницы. Нужен тариф с поддержкой собственного HTML. Проверяйте опубликованный сайт, не редактор. Инструкция Tilda.

WordPress и WooCommerce

Установите Insert Headers and Footers от WPCode, откройте Code Snippets → Header & Footer, вставьте код в Footer и сохраните. Если общий код уже добавляется другим плагином, используйте его. На WordPress.com требуется тариф Personal, Premium, Business или Commerce; бесплатный тариф не подходит. Инструкция WordPress.com.

Shopify

В Online Store → Themes сделайте копию темы и выберите Edit code. Добавьте код в layout/theme.liquid перед </body>, сохраните и опубликуйте нужную тему. При других layout-файлах попросите разработчика проверить и их. Способ относится к витрине, а не к оформлению заказа и новым страницам аккаунта покупателя. Пробную платную тему нужно купить для редактирования кода. Редактор Shopify, общие шаблоны Shopify.

1С-Битрикс: Управление сайтом

Активный шаблон указан в Настройки → Настройки продукта → Сайты → Список сайтов у нужного сайта. Разработчик сохраняет копию его footer.php и добавляет код перед </body>. Файл находится в /local/templates/<template-id>/footer.php или /bitrix/templates/<template-id>/footer.php. Общий файл ядра /bitrix/footer.php менять не нужно. Если шаблонов несколько, проверить каждый используемый шаблон. Это инструкция для CMS 1С-Битрикс, а не конструктора сайтов Битрикс24. Структура шаблона в документации 1С-Битрикс.

Wix

Нужны опубликованный сайт и подключённый домен. В Settings → Development & integrations → Custom Code → Add Custom Code добавьте код, выберите All pages, загрузку один раз за посещение и Body – end, затем Apply. Используйте Custom Code вместо HTML iframe. Wix ограничивает выполнение некоторых сторонних скриптов: если код блокируется, передайте ошибку поддержке msg8 или разработчику. После смены основного домена добавьте код заново: Wix удаляет прежние фрагменты. Инструкция Wix.

Webflow

Откройте Site settings → Custom code → Footer code, вставьте код и нажмите Save changes. Затем опубликуйте сайт на нужный домен через Publish. Нужен активный Site plan или Workspace Core, Growth, Agency или Freelancer; нужны права Site manager или Designer. Инструкция Webflow.

Squarespace

Откройте Pages → Custom Code → Code Injection (в версии 7.0: Pages → Website Tools → Code Injection), добавьте код в общее поле Footer и сохраните. Функция доступна на Core, Plus, Advanced и некоторых прежних тарифах. Страницы оформления заказа не поддерживают этот код. Инструкция Squarespace.

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

Шаг 3. Проверьте установку

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

⚠️ Виджета не видно на сайте?

  • Проверьте, что адрес сайта есть в списке: Настройки агента → Безопасность → «Где можно показывать чат». Браузер не откроет чат на домене, которого там нет — это самая частая причина.
  • Убедитесь, что скрипт скопирован целиком и сайт опубликован.
  • Очистите кэш браузера или откройте сайт в режиме инкогнито.
  • Если вы ранее отключали показ виджета, включите его в настройках агента.
  • Если платформа требует публикации, проверьте, что изменения опубликованы именно на нужный домен.

💡 Если на сайте стоит Яндекс.Метрика или Google Analytics, виджет сам передаёт в них открытие чата, первое сообщение и оставленный контакт — подключать ничего не нужно, только создать цели по инструкции Цели в Метрике и Google Analytics.

Что дальше

  • Внешний вид виджета настраивается в Песочнице на вкладке «Дизайн».
  • Чтобы агент собирал заявки — раздел «Сбор лидов».
НазадСоздание первого агентаДалееКачество ответов