1. Главная
  2. Документация
  3. Установка чат-виджета на сайт

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

Код вставки, внешний вид, форма перед чатом, домены и письма посетителю.

Виджет это кнопка чата на вашем сайте. Посетитель пишет в окно чата, сообщение приходит в раздел «Чаты», а из первого сообщения создаётся заявка. Подключает и настраивает виджет администратор компании.

Шаг 1. Подключите виджет

  1. Откройте «Настройки компании» -> «Интеграции» и выберите вкладку «Виджет на сайт».
  2. Нажмите «Подключить виджет».

На странице появятся блок «Код для сайта», ключ виджета и карточки настроек.

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

Код вставки это одна строка. Скопируйте её кнопкой «Скопировать» в блоке «Код для сайта». Она выглядит так (вместо слова КЛЮЧ будет ключ вашего виджета):

<script async src="https://crm.linkodium.com/wc/КЛЮЧ.js"></script>
  1. Вставьте код перед закрывающим тегом </body> на всех страницах сайта.
  2. Сохраните изменения и обновите страницу сайта: в углу появится кнопка чата.
  • Менеджеры тегов. Подойдёт Google Tag Manager или Яндекс.Тег: тег «Пользовательский HTML».
  • Tilda. Блок T123 «HTML-код» на каждой странице или в общем подвале.
  • Общий код CRM. Если на сайте уже стоит код со вкладки «Трекинг», отдельная строка виджета не нужна: выберите виджет в поле «Чат на сайте» блока «Модули скрипта», и общий код загрузит его сам. Если на странице остались оба кода, кнопка чата всё равно появится один раз. Подробнее: Один код на сайте.

Если на сайте настроен Content-Security-Policy

Если ваш сайт отправляет заголовок Content-Security-Policy, разрешите в нём адрес чата в двух директивах:

script-src https://crm.linkodium.com;
frame-src https://crm.linkodium.com;

Если директива frame-src не задана, добавьте адрес в child-src или default-src. Стили, шрифты и картинки чат с вашего сайта не загружает, поэтому другие директивы менять не нужно.

Управление с сайта

Окном чата можно управлять из кода сайта, например открывать его по своей кнопке:

LinkodiumChat('open')
LinkodiumChat('close')
LinkodiumChat('hide')
LinkodiumChat('show')
LinkodiumChat('prefill', {name: 'Анна', email: 'anna@example.ru'})

Полный пример с вызовом команд до загрузки чата есть на странице виджета в кабинете: раскрывающийся блок «Управление с сайта (JavaScript)».

Шаг 3. Проверьте

  1. На странице виджета нажмите «Открыть чат для проверки»: чат откроется на отдельной странице, даже если код на сайт ещё не поставлен.
  2. Напишите сообщение. Оно появится в разделе «Чаты», а в разделе «Заявки» новая заявка. Источник заявки по умолчанию называется «Виджет на сайте».
  3. Ответьте из CRM и убедитесь, что ответ виден в окне чата.
  4. Откройте свой сайт и проверьте, что кнопка чата на месте. В карточке «Сайты» в списке «Виджет замечен на:» появится адрес сайта.

Настройки виджета

Все настройки ниже находятся на той же странице. После изменений нажмите «Сохранить настройки виджета».

«Внешний вид»

ПолеЧто задаёт
«Название в заголовке чата»Заголовок окна, обязательное поле, до 60 символов. Сначала в нём стоит название компании.
«Цвет»Основной цвет виджета. Если текст на таком цвете плохо читается, CRM предупредит.
«Положение кнопки»«Справа внизу» или «Слева внизу», а также «Отступ снизу, пикселей».
«Приветствие в окне чата»Текст, который посетитель видит в открытом окне до первого сообщения. В переписку не сохраняется.
«Имя оператора»Например: «Анна, менеджер». Если пусто, в шапке только название.
«Фото оператора»JPEG, PNG или WebP до 1 МБ, лучше квадратное. Кнопки «Загрузить фото» и «Удалить фото».
«Текст в нерабочее время»Обязательное поле, до 300 символов. Показывается в окне чата вне рабочего времени, если в карточке «Канал» включён ответ в нерабочее время.

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

«Форма перед чатом»

Для каждого из полей «Имя», «Телефон» и «Email» выберите: «Не спрашивать», «Необязательно» или «Обязательно». Поля появятся над полем ввода до первого сообщения посетителя. Имя, телефон и email попадут в заявку.

  • «Уведомление под полем ввода»: текст о данных виден под полем ввода.
  • «Галочка согласия перед первым сообщением»: посетитель должен отметить согласие, прежде чем написать.
  • «Не показывать»: CRM предупредит, что без уведомления сбор данных посетителей может нарушать 152-ФЗ.

В поле «Ссылка на политику или текст согласия» укажите адрес документа на вашем сайте. Для режима «Галочка согласия перед первым сообщением» ссылка обязательна: без неё настройки не сохранятся («Для галочки согласия укажите ссылку на текст согласия»). В режиме «Уведомление под полем ввода» ссылку можно не указывать, тогда посетитель увидит текст без ссылки. Ответственность за законность обработки данных посетителей несёт владелец сайта.

«Файлы»

Галочка «Разрешить посетителям отправлять файлы» и предел «Размер файла до»: 5, 10 или 25 МБ. Посетитель может прислать картинки (JPEG, PNG, GIF, WebP, HEIC), PDF, документы Word, Excel, PowerPoint, OpenDocument, RTF, TXT и CSV. TXT и CSV принимаются в UTF-8, в кодировке Windows (так их сохраняют Excel и Блокнот) и в Юникоде. В одном сообщении посетителя до 5 файлов и до 4000 символов текста. Файлы занимают место в хранилище компании.

«Письма посетителю»

Галочка «Сообщать посетителю об ответе по email». Если посетитель оставил email, ушёл с сайта и не прочитал ответ в течение 3 минут, ему придёт письмо со ссылкой на переписку. Письма уходят не чаще раза в 30 минут, текст ответа в письмо не попадает.

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

Чтобы письма работали, включите поле «Email» в карточке «Форма перед чатом». Посетитель может отписаться от писем по ссылке в письме.

«Сайты»

  • «Любой сайт»: виджет работает на любом сайте, где стоит код.
  • «Только перечисленные сайты»: на других сайтах чат не откроется. Впишите сайты по одному в строке. Поддомены укажите отдельно или так: *.site.ru.

Список «Виджет замечен на:» показывает, на каких сайтах виджет уже загружался. Кнопка «Добавить в список» переносит адрес в список разрешённых.

Режим «Только перечисленные сайты» не закрывает страницу чата на самой CRM (https://crm.linkodium.com/wc/...): её открывают кнопка «Открыть чат для проверки» и ссылки на переписку в письмах посетителю, и она работает при любом режиме у всех, кто знает ключ виджета. Ключ виден в коде на вашем сайте. Если через ключ идёт спам или код скопировали на чужой сайт, выпустите новый ключ: старый перестанет работать везде.

«Канал»: автоответы и расписание

Карточка «Канал» у виджета такая же, как у ботов: «Источник заявок», «Менеджер канала», «Приветствие новому клиенту», «Ответ в нерабочее время», «Расписание работы» и «Просить номер телефона». Она описана на странице Автоответы и права.

Если ответ в нерабочее время включён, вне расписания в шапке окна чата вместо «Мы на связи» показывается «Сейчас не в сети».

Что видно о посетителе

В разделе «Чаты» в шапке переписки показываются сведения о посетителе: «На сайте сейчас» или время последнего визита, страница, с которой он пишет, email, источник, устройство и отметка о согласии на обработку данных. Источник (метки UTM и сайт, с которого пришёл посетитель) не показывается сотруднику, которому не видна заявка этого чата.

Антиспам

Если в компании включён антиспам (вкладка «Трекинг», блок «Модули скрипта»), он проверяет первое сообщение нового посетителя. В режиме «Проактивная защита» подозрительному посетителю перед первым сообщением показывается задача-пазл. В боевом режиме заявка из явного спама сразу получает статус «Спам»: уведомлений и автоответов по ней нет, переписка остаётся в разделе «Чаты». Оценка видна в карточке заявки. Подробнее: Антиспам.

Блокировка посетителя

Если в чат пишет спамер, администратор может его заблокировать:

  1. Откройте переписку в разделе «Чаты».
  2. Нажмите кнопку с тремя точками («Действия с перепиской») и выберите «Заблокировать посетителя».
  3. Подтвердите действие.

Новые сообщения заблокированного посетителя не попадают в CRM, при этом сам он о блокировке не узнаёт. В списке у переписки появится пометка «Заблокирован», а ответить такому посетителю нельзя. Вернуть всё обратно можно пунктом «Разблокировать посетителя» в том же меню.

Если удалить переписку заблокированного посетителя («Удалить переписку» в том же меню), блокировка сохранится: его новые сообщения из того же браузера по-прежнему не попадут в CRM. Переписка незаблокированного посетителя после удаления закрывается и у него: если он напишет снова, в CRM появится новая переписка.

Перевыпуск ключа

Ключ виджета входит в код вставки. Если код попал на чужой сайт или вы хотите, чтобы старый код перестал работать, выпустите новый ключ.

  1. На странице виджета нажмите «Выпустить новый ключ» и подтвердите.
  2. Скопируйте новый код из блока «Код для сайта».
  3. Замените код на всех страницах сайта.
Пока вы не замените код, чат на сайте работать не будет. Ссылки «Открыть переписку» в уже отправленных посетителям письмах тоже перестанут работать.

Кнопка «Выйти на всех устройствах» в профиле ключ виджета не отзывает: ключ принадлежит компании.

Отключение виджета

Нажмите «Отключить виджет» и подтвердите. Кнопка чата исчезнет с сайта, переписка сохранится. Вернуть виджет можно кнопкой «Включить виджет».