Как установить чат на сайт

Порядок подключения

1. 1 Регистрация По почте или через Telegram, Яндекс либо VK. Карта не нужна.
2. 2 Добавьте сайт Укажите название и домен. Чат будет работать на этом домене и на его версии с www, на чужом сайте ваш код его не поднимет.
3. 3 Настройте чат и вид Заголовок окна, имя и должность отвечающего, цвета, значок и место кнопки, приглашение и до трёх быстрых ответов, звуки. Справа видно, как окно будет выглядеть на сайте.
4. 4 Подключите Telegram Наш бот добавляется в вашу группу одной кнопкой, свой подключается токеном. Подробно на странице про Telegram.
5. 5 Вставьте код Скопируйте строку из кабинета в шаблон сайта или отдайте разработчику готовое задание.

Код вставки

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

Скрипт грузится с признаком async и не задерживает показ страницы.

На последнем шаге мастера есть три вкладки: сам код, задание для разработчика или ИИ-помощника, которое можно переслать целиком, и установка через Яндекс Тег-Менеджер, если он уже стоит на сайте.

<script async
  src="https://api.widgetchat.ru/widget/bozex-support-widget.js"
  data-widget-id="wc_ваш_идентификатор"></script>

Тильда

1. 1 Откройте настройки сайта В Тильде: Настройки сайта, раздел Ещё, поле для HTML-кода перед закрывающим тегом body.
2. 2 Вставьте строку и сохраните Код добавляется один раз и действует на всех страницах.
3. 3 Опубликуйте страницы заново Тильда применяет настройки только после публикации. Не опубликовали, и чата на сайте не будет.

• Справка Тильды: что недоступно на бесплатном тарифе

Свой код в Тильде вставляется только на платном тарифе. В редакторе Тильды виджет не запускается, смотрите опубликованный сайт.

WordPress

Проще всего наш плагин из каталога WordPress: он спрашивает только номер виджета. Без плагина строка ставится в подвал темы через плагин вставки кода или в footer.php дочерней темы. Все способы и проверка расписаны на отдельной странице.

• Чат для сайта на WordPress

1С-Битрикс

1. 1 Откройте шаблон сайта Административный раздел: Настройки, Настройки продукта, Сайты, Шаблоны сайтов. Нужен шаблон, по которому собраны страницы с чатом.
2. 2 Найдите конец страницы В коде шаблона это footer.php или нижняя часть общего шаблона.
3. 3 Вставьте строку перед закрывающим тегом body Сохраните шаблон и сбросьте кеш сайта, иначе посетители ещё какое-то время будут получать старую страницу.

У главной, каталога и личного кабинета шаблоны нередко разные. Код нужен в каждом, где должен работать чат.

Другие конструкторы и свой сайт

У большинства конструкторов в настройках сайта есть поле для своего кода, строка идёт туда. На своём сайте её кладут в общий шаблон. На одностраничнике прямо в разметку страницы перед закрывающим тегом body.

Проверка

• Кнопка на месте Откройте сайт в обычном окне браузера: кнопка должна стоять в выбранном углу.
• Сообщение дошло Напишите себе из чата и убедитесь, что в группе Telegram появилась тема.
• Ответ вернулся Ответьте в теме, и сообщение появится в окне на сайте без обновления страницы.
• Цели в Метрике и Google Если на сайте стоит Яндекс Метрика или теги Google, чат сам отправляет туда события: открытие окна, первое сообщение, ответ поддержки. Код на сайте править не нужно. В Метрике остаётся завести цели типа JavaScript-событие с идентификаторами widgetchat_open, widgetchat_first_message и widgetchat_reply, полный список в документации к виджету.

Если чат не появился

• Домен не совпадает Чат работает на домене из кабинета и на его версии с www. Поддомен или второй домен добавляем мы по вашей просьбе в чате.
• Код не в том шаблоне У части сайтов главная и внутренние страницы собраны из разных шаблонов.
• Кеш Сбросьте кеш сайта и обновите страницу без кеша браузера. На Тильде опубликуйте страницы заново.
• Оптимизаторы и блокировщики Плагины ускорения иногда откладывают чужие скрипты, а блокировщики рекламы прячут виджеты чатов. Проверьте в другом браузере без расширений.