Как установить DiveChat на свой сайт: пошаговая инструкция

Онлайн-чат — самый быстрый способ превратить посетителя сайта в заявку: человек спрашивает и получает ответ, пока ещё находится на странице. В этой статье пошагово покажем, как установить DiveChat за 15 минут — от регистрации до ИИ-оператора и подключения мессенджеров. Сначала коротко о том, что такое DiveChat.

Что такое DiveChat и как он работает

DiveChat — это единый онлайн-чат для сайта. Он собирает обращения с сайта, мессенджеров и соцсетей в одном окне, чтобы команда отвечала быстрее и ничего не теряла.

Как это работает по шагам:

• посетитель заходит на сайт и видит виджет чата, кнопку в углу экрана;
• он пишет вопрос — или чат сам предлагает помощь в нужный момент (активное приглашение);
• первую линию берёт ИИ-оператор: отвечает на типовые вопросы 24/7 и закрывает до 80% рутины;
• сложное передаётся живому оператору вместе с историей диалога — клиент не объясняет всё заново;
• все каналы (сайт, Telegram, соцсети) — в одном окне, а при желании обращения уходят в CRM.

Что понадобится для внедрения онлайн-чата на сайт

Внедрить окно диалога или ИИ-ассистента очень просто. Для этого нужны:

• сайт (на любой CMS или конструкторе — Tilda, WordPress, Bitrix и др.);
• доступ к его коду или админке (чтобы вставить небольшой скрипт);
• 10–15 минут времени. Программист не нужен.

Рассмотрим шаги внедрения:

Шаг 1. Регистрация и создание проекта

1. Зарегистрируйтесь на сайте DiveChat через почту или номер телефона. Вы получите аккаунт DiveID на основе почты и пароля.

2. Войдите в личный кабинет и откройте вкладку «Аккаунт» или «Проекты».

3. Нажмите «Создать», введите название проекта (например, «Интернет-магазин Мебель») и выберите тариф — Базовый бесплатный или Профессиональный с полным пакетом возможностей.

Первая часть проекта будет готова.

Шаг 2. Создайте канал и получите код виджета

1. Внутри проекта создайте первый канал и назовите его (например, «Основной виджет сайта»).

2. После создания система покажет блок кода на JavaScript (начинается с «<script>»). Это будет вашим виджетом — скопируйте его.

Шаг 3. Установи код на сайт

Есть три способа — выберите удобный:

1. HTML-сайт: откройте файл сайта (index.html или footer.php) и вставьте код перед закрывающим тегом </head>.

2. CMS / конструктор: найдите раздел «Custom Code», «HTML-вставки» или «Header/Footer» и вставьте скрипт туда.

3. Google Tag Manager: создайте тег «Пользовательский HTML», вставьте код и поставьте триггер «All Pages».

Установка чата на Tilda

Настройки сайта → «Ещё» → поле «HTML-код для вставки внутрь HEAD» → вставьте код → сохраните и опубликуйте сайт. (Для одной страницы можно использовать блок T123 с HTML.)

Установка чата на WordPress

Проще всего работать плагином для вставки кода (например, «Insert Headers and Footers» или «WPCode»): вставьте скрипт в область Header (перед </head>) и сохрани. Либо вручную в теме: Внешний вид → Редактор → header.php перед </head>.

Установка чата на Bitrix

Открой шаблон сайта (header.php) и вставьте код перед </head>. Либо через «Управление структурой» / верхний колонтитул шаблона. Сохраните изменения.

💡 Совет. Точная инструкция под каждую платформу есть в базе знаний в разделе «Установка чата» — там разобраны Tilda, WordPress, Bitrix, Joomla, OpenCart, PrestaShop, WIX, Shopify и др.

Шаг 4. Проверьте, что чат установился

1. Опубликуйте изменения на сайте.

2. Откройте сайт в режиме инкогнито или с телефона.

3. Напишите в чат «Привет».

4. Сообщение должно появиться в разделе «Диалоги» в админке DiveChat. Пришло — значит, всё установлено верно.

Шаг 5. Настройте внешний вид и тексты виджета

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

• пропишите приветствие и тексты виджета;

• добавьте ссылки на мессенджеры и соцсети;

• обязательно включите согласие на обработку персональных данных (152-ФЗ).

Шаг 6. Добавьте операторов и команду

• пригласите сотрудников по e-mail и раздайте роли и права доступа;

• настройте рабочее время и статусы — чтобы понимать, кто на линии.

Шаг 7. Подключите мессенджеры и соцсети

Чтобы сообщения из мессенджеров падали в то же окно, подключите каналы:

• Telegram — divechat.ru/help/communication-channels/integraciya-s-telegram
• MAX — divechat.ru/help/communication-channels/integraciya-s-max

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

Шаг 8. Включите автоматизацию

• Активные приглашения — чат пишет первым по поведению (долго на странице цен, завис в корзине, вернулся повторно). Создать карусель Добавьте описание

• Автоприветствия и автоответы, в том числе режим для нерабочего времени — чтобы ночные обращения не терялись.

• Смарт-сообщения: формы контактов, офлайн-формы обратной связи, оценка качества обслуживания.

• Удерживающие фразы при задержке ответа — клиент видит, что им занимаются.

💡 Совет. Не превращайте приглашения в спам: одно уместное окно вовлекает, три навязчивых — отпугивают. Привязывайте их к поведению, а не показывай всем на первой секунде.

Шаг 9. Настройте ИИ-оператора

Автоматизация поможет избавить менеджеров от рутины, чтобы направить силы на стратегически важные задачи.

1. Соберите базу знаний: частые вопросы, цены, условия, доставка — то, что чаще всего спрашивают.

2. Настройте промпты:

как отвечать, каким тоном и когда передавать диалог живому оператору.

3. Протестируйте на реальных вопросах. ИИ закроет рутину 24/7, а сложное отдаст человеку с историей.

Шаг 10. Интеграция с CRM

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

Шаг 11. Смотрите статистику

В разделе статистики отслеживайте главное: скорость первого ответа, число и качество диалогов, конверсию из диалога в заявку и показатели по сотрудникам. По этим цифрам видно, что улучшать.

Частые ошибки новичков при внедрении чата на сайт

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

Чек-лист как запустить чат на сайт

☐ Зарегистрироваться и создать проект

☐ Создать канал и скопировать код

☐ Вставить код на сайт (перед </head>)

☐ Проверить через «Привет» в «Диалогах»

☐ Настроить внешний вид, тексты и 152-ФЗ

☐ Добавить операторов и рабочее время

☐ Подключить Telegram/MAX

☐ Включить приглашения и автоответы

☐ Настроить ИИ-оператора

☐ Подключить CRM

Полезные ссылки

• База знаний
• Первый запуск и установка
• Поддержка: support@divechat.ru

Остались вопросы по установке? Пиши в личные сообщения — поможем разобраться 👇