Как установить чат на сайт: код, кнопка и модуль для CMS
Три способа поставить чат на сайт: строка кода, модуль для CMS и помощь разработчика. Пошагово для HTML, Битрикса, WordPress и конструкторов, и как проверить, что всё работает.
Установить чат на сайт обычно проще, чем кажется. Почти все сервисы дают одну строку кода: её вставляют в шаблон сайта, и кнопка чата появляется на всех страницах. Если сайт на популярной CMS, хватит модуля, который ставится без правки кода.
Ниже — три способа установки, шаги для частых платформ и проверка после запуска.
Что нужно до установки
Сначала чат надо завести в выбранном сервисе: зарегистрироваться, создать проект и указать адрес сайта. После этого сервис выдаст код для вставки или предложит модуль.
До установки полезно решить ещё две вещи:
- кто будет отвечать. Если оператора нет, чат должен сам отвечать на частые вопросы и честно предлагать оставить контакты;
- что чат должен знать. Доставка, оплата, возврат, график, контакты. ИИ-чат читает это с сайта сам, но пробелы лучше закрыть заранее.
Как выбрать сам сервис, разобрано в статье Чат для сайта: какой выбрать.
Способ 1. Вставить код в шаблон
Самый универсальный путь. Работает на любом сайте, где есть доступ к шаблону.
- Скопируйте код чата в кабинете сервиса. Обычно это одна строка с тегом
scriptи ключом вашего проекта. - Откройте общий шаблон сайта: файл, который подключается на всех страницах. Чаще всего это подвал или шапка.
- Вставьте код перед закрывающим тегом
</body>. - Сохраните шаблон и откройте сайт в новой вкладке. В углу должна появиться кнопка чата.
Код загружается асинхронно и не тормозит страницу. Если сайт кеширует страницы, после вставки кеш нужно сбросить.
Способ 2. Модуль для CMS
Если сайт работает на CMS, чат можно поставить модулем: без редактирования шаблона и без разработчика.
1С-Битрикс. Архив модуля распаковывают в папку /bitrix/modules, затем в админке открывают «Marketplace» → «Установленные решения» и нажимают «Установить». В настройках модуля вводится ключ проекта, и чат появляется на всех страницах.
WordPress. Плагин ставится из архива через «Плагины» → «Добавить новый» → «Загрузить». После активации ключ вводится на странице настроек плагина.
OpenCart, Joomla, MODX, Drupal. Порядок тот же: загрузить модуль, включить, вставить ключ.
Конструкторы сайтов. В Тильде и похожих конструкторах код вставляется в настройки сайта, в поле для HTML-кода на всех страницах, или отдельным HTML-блоком. Программировать не нужно, но доступ к настройкам сайта нужен.
Способ 3. Отдать задачу разработчику
Если доступа к сайту нет, проще всего отправить код разработчику. Хорошие сервисы умеют собрать для него письмо: код, куда его вставить и как проверить. Работы на несколько минут.
Важно договориться, кто проверит результат. Код, вставленный только на главную, а не в общий шаблон, — частая ошибка: на остальных страницах чата не будет.
Можно ли поставить чат без кода
Можно, если сайт на CMS или конструкторе: модуль или поле для HTML в настройках закрывают задачу без программирования.
Иногда под «чатом без кода» имеют в виду просто ссылку на страницу переписки, которую отправляют клиентам или ставят на кнопку. Это работает, но это уже не чат на сайте: посетитель уходит со страницы, а чат ничего не знает о том, где он был и что смотрел.
Где разместить кнопку чата
- В нижнем углу. Посетители привыкли искать чат именно там. Правый угол — самый частый выбор, левый подойдёт, если справа уже есть другие кнопки.
- Не закрывая важное. На телефоне кнопка не должна перекрывать «В корзину», «Позвонить» и меню.
- Без самораскрытия. Окно, которое открывается само через пару секунд, раздражает. Пусть посетитель откроет чат, когда у него появится вопрос.
- С понятным приветствием. Первая фраза и кнопки с частыми темами помогают начать разговор без раздумий.
Как проверить, что чат работает
- Кнопка видна на всех страницах. Откройте главную, страницу товара или услуги, контакты.
- Работает на телефоне. Окно открывается на весь экран, клавиатура не закрывает поле ввода.
- Чат отвечает. Задайте два-три частых вопроса и проверьте, что ответы верные и со ссылками.
- Обращение доходит до оператора. Попросите позвать человека и убедитесь, что уведомление пришло туда, где сидит оператор.
- Ответ оператора доходит до посетителя. Ответьте из кабинета или мессенджера и посмотрите, появился ли ответ в окне.
Вывод и следующий шаг
Установка чата — это одна строка кода в общем шаблоне или модуль для CMS. Основное время уходит не на установку, а на подготовку: кто отвечает и что чат должен знать.
У Ассистента AISSE настройка идёт разговором: он сам спрашивает про вид окна, оператора и подключение, проверяет, что код стоит на сайте, и читает справку с ваших страниц. Подробная инструкция — в справке: как подключить Ассистента.
Частые вопросы
Замедлит ли чат загрузку сайта?
Нормально сделанный чат грузится асинхронно, после основного содержимого страницы. На скорость, которую видит посетитель, он почти не влияет.
Нужно ли вставлять код на каждую страницу?
Нет. Код вставляется один раз в общий шаблон, который подключается на всех страницах.
Как поставить чат на Битрикс?
Модулем из архива или вставкой кода в шаблон сайта перед </body>. Модуль удобнее: обновления и настройки собраны в админке Битрикса.
Можно ли поставить чат, если у сайта нет своей CMS?
Да. Для статичного HTML-сайта код вставляется в каждый шаблон страницы или в общий подключаемый файл, если он есть.