🌐 Виджет
Встраиваемый чат для вашего сайта. В селекте «Платформа» канал так и называется — «Виджет».
Виджет — это чат в реальном времени. Посетитель пишет прямо со страницы, обращение попадает в «Поддержка» → «Чаты», оператор отвечает из Fixorix. Других способов связи (обратный звонок, email-форма) виджет не предлагает.
Создание
Виджет создаётся в разделе «Каналы» (левое меню, группа «Проект») кнопкой «Создать». В окне «Создание канала» в поле «Платформа» выберите «Виджет» — дальше мастер из трёх шагов.
Шаг 1 — «Создание канала». Заполните поля и нажмите «Далее».
| Поле | Обязательно | Что вводить |
|---|---|---|
| Название | да | Имя канала в списке. Подсказка: «Например: Чат поддержки». |
| Описание | нет | Заметка для себя. Подсказка: «Например: виджет на лендинге». |
| Укажите домен сайта | да | Домен, на котором будет работать чат. Подсказка: «Например: example.ru или localhost». |
Шаг 2 — «Внешний вид виджета». Настройте цвета, позицию и поведение чата (те же параметры, что на вкладках «Вид» и «Чат» — см. таблицу ниже). На широком экране рядом показывается живое превью. Кнопка «Назад» возвращает к первому шагу, кнопка «Создать» создаёт канал.
Шаг 3 — «Виджет готов». Здесь выдаются код установки, HMAC-секрет и техническая информация (Widget ID, Host). Кнопка «К списку каналов» закрывает мастер.
Подробное пошаговое руководство с примером кода — Установка виджета.
Секрет вида widsk_… выдаётся на шаге «Виджет готов» и больше нигде не отображается. Сохраните его сразу — он нужен для опознания пользователей (см. ниже). Если секрет потерян, выпустите новый кнопкой «Сбросить секрет».
Домен виджета
Домен нужен, чтобы виджет разрешили загружать на вашем сайте.
- Список разрешённых доменов общий для проекта: домен, добавленный при создании или редактировании любого виджета, начинает работать для всех виджетов этого проекта.
- Домен указывайте без порта:
localhost, а неlocalhost:3000. Порт при проверке отбрасывается, и виджет со страницы на нестандартном порту получит отказ. - Схему
https://убирать не обязательно — введённое значение нормализуется автоматически. - Страница чата встраивается только по HTTPS. По
http://localhostбраузер заблокирует фрейм, даже если доменlocalhostразрешён.
Карточка виджета
Клик по строке канала открывает справа панель «Детали виджета»:
| Поле | Что показывает |
|---|---|
| Название | Имя канала (если не задано — «Без названия»). |
| Описание | Заметка, если она была заполнена. |
| Домен | Домен, привязанный к виджету. |
| Платформа | Пилюля «Виджет». |
| Статус | Пилюля «Работает» или «Остановлен». |
| Скрипт для вставки на сайт | Готовый код установки с кнопкой «Скопировать». |
| ID виджета | Идентификатор виджета (он же Widget ID из сниппета). |
| ID клиента | Внутренний идентификатор клиента. |
| HMAC-секрет | Секция с кнопкой «Сбросить секрет». |
Код установки
Сниппет лежит в карточке виджета (строка «Скрипт для вставки на сайт») и на вкладке «Детали». Над кодом — переключатель из двух режимов и ссылка «Документация по подключению».
| Режим | Что даёт | Что нужно на вашей стороне |
|---|---|---|
| «Без авторизации» | Обычный анонимный чат: посетитель пишет, не представляясь | Вставить одну строку кода на страницы сайта |
| «С авторизацией» | Чат открывается от имени вошедшего на сайт пользователя: одна история переписки на всех его устройствах, у оператора виден контакт | Считать подпись посетителя на сервере (HMAC-секрет) и передать её виджету |
Переключение режима меняет только текст сниппета: настройки виджета от этого не зависят.
- В режиме «Без авторизации» код — это одна строка
scriptс адресом загрузчика и идентификатором виджета. - В режиме «С авторизацией» к нему добавляется вызов инициализации с полями
widgetId,userId,userHashи, при желании,email. ЗначенияuserIdиuserHashподставляет ваш сайт — в сниппете на их месте стоят заглушки, которые нужно заменить.
Кнопка «Скопировать» копирует код целиком в том режиме, который выбран сейчас.
Если авторизации на сайте нет или она не важна для поддержки, берите режим «Без авторизации» — чат заработает сразу. Перейти на режим с авторизацией можно в любой момент, заново создавать виджет не нужно.
Пошаговое руководство с готовым примером — Установка виджета.
Настройки виджета
Настройки правятся в панели «Редактирование виджета» — иконка карандаша в строке канала. Четыре вкладки: «Основные», «Вид», «Чат», «Детали». На вкладках «Вид» и «Чат» рядом показывается живое превью. Изменения сохраняются кнопкой «Сохранить», после чего появляется уведомление «Виджет обновлён».
Вкладка «Основные»
| Настройка | Что делает |
|---|---|
| Название | Имя канала в списке. Обязательное поле. |
| Описание | Свободная заметка. |
| Привязанный домен | Домен, на котором работает виджет. При некорректном вводе появляется «Введите корректный домен». |
При смене домена показывается предупреждение: «Внимание: изменение домена приведет к тому, что виджет перестанет загружаться на вашем текущем сайте, убедитесь, что вы перенесли код на новый ресурс.»
Вкладка «Вид»
| Настройка | Что делает |
|---|---|
| Основной цвет | Цвет кнопки-лаунчера и шапки чата. |
| Оттенок текста | Дополнительный цвет оформления чата. |
| Позиция виджета | «Слева» или «Справа» — угол экрана, в котором появляется кнопка чата. |
| Показывать аватар оператора | Переключатель. Подсказка: «Лицо оператора в чате повышает доверие. Выключите для строгого корпоративного стиля.» |
Вкладка «Чат»
| Настройка | Что делает |
|---|---|
| Задержка автооткрытия, сек | Через сколько секунд чат откроется сам. Значение -1 (и любое значение меньше единицы) отключает автооткрытие; задержка больше 60 секунд обрезается до 60. |
| Приветственное сообщение | Первое сообщение, которое увидит посетитель. До 256 символов. |
Настройки «Показывать аватар оператора» и «Приветственное сообщение» сохраняются и видны в предпросмотре, но на сайт клиента не передаются — посетитель видит аватар и приветствие, заданные по умолчанию.
На вкладке «Чат» указано: «Скоро здесь появятся настройки таймеров и графика работы». Настроек рабочего времени и текста вне рабочего времени в продукте сейчас нет.
Вкладка «Детали»
| Поле | Что показывает |
|---|---|
| Widget ID | Идентификатор виджета — он же подставляется в сниппет. |
| Host | Домен, привязанный к виджету. |
| Уникальный ключ | Идентификатор клиента. |
| Код установки | Сниппет с кнопкой «Скопировать». |
| HMAC-секрет | Секция с кнопкой «Сбросить секрет». |
Остановка виджета
В строке канала есть кнопка «Выключить виджет» / «Включить виджет», а текущее состояние показывается пилюлей в колонке «Статус»: «Работает» или «Остановлен». После действия появляется уведомление «Виджет выключен» или «Виджет включён»; если переключить не удалось — «Не удалось изменить состояние виджета. Попробуйте ещё раз.».
Что происходит при выключении:
- виджет перестаёт работать на сайте: загрузчик не получает ни настроек, ни доступа к чату, поэтому переписка не открывается и новые обращения не создаются;
- снимать сниппет со страниц не нужно — код остаётся на месте и ничего не ломает;
- обратное включение мгновенно, повторно вставлять код не требуется;
- в разделе «Каналы» выключенный виджет остаётся в списке со статусом «Остановлен» и доступен для редактирования.
Остановка удобна, когда сайт на техобслуживании или отдел поддержки временно не работает.
Выключение виджета не трогает историю: обращения, созданные раньше, остаются в разделе «Чаты». После включения посетитель продолжит ту же переписку.
Что умеет чат в виджете
Сообщения
- Текст оформляется Markdown: жирный, курсив, зачёркивание, инлайн-код и блоки кода, маркированные и нумерованные списки, цитаты, горизонтальные линии, ссылки (открываются в новой вкладке). Заголовки, таблицы, картинки и сырой HTML не поддерживаются — разметка отбрасывается, текст остаётся. Одиночные переносы строк сохраняются.
- Enter — отправить, Shift+Enter — перенос строки.
- Кнопка со смайликом открывает эмодзи-пикер с категориями: «Часто используемые», «Смайлики и люди», «Животные и природа», «Еда и напитки», «Путешествия и места», «Активности», «Объекты», «Символы», «Флаги».
Вложения
- Кнопка «Прикрепить файл» в поле ввода. Файлы выбираются по одному, предел размера — 10 МБ.
- Выбранный файл показывается чипом с именем и крестиком «Убрать вложение»; при ошибке загрузки появляется «Не удалось загрузить файл».
- В ленте картинки (
png,jpg,gif,webp,bmp,avif) показываются превью; клик открывает полноэкранный просмотр с кнопкой «Закрыть» и закрытием поEsc. Остальные файлы, включая SVG, показываются чипом-ссылкой для скачивания.
Лента
- Ответ-цитата: над сообщением видна плашка с автором и текстом оригинала; клик по ней прокручивает ленту к исходному сообщению и подсвечивает его.
- Разделители дней: «Сегодня», «Вчера» или дата.
- Умный автоскролл: лента сама уезжает вниз, если посетитель уже внизу или сам написал; если он читает выше и приходит ответ — появляется кнопка «Новые сообщения ↓».
- История догружается порциями при прокрутке вверх — позиция чтения при этом не сбивается.
- Пока устанавливается соединение, показывается «Подключение…», а если оно затянулось — «Не удаётся подключиться, пробуем ещё…».
Кнопки под сообщением
Сообщение от сценария может содержать ряды кнопок (инлайн-клавиатуры). Кнопка-ссылка помечена 🔗 и открывает адрес в новой вкладке, запрос контакта — 📞, геолокации — 📍. Обычная кнопка отправляет свой текст ответом от лица посетителя; после первого нажатия все кнопки этого сообщения становятся неактивными.
Опознанный пользователь
Если посетитель уже авторизован на вашем сайте, его можно опознать — тогда история переписки будет одна и та же на всех его устройствах, а оператор увидит корректный контакт.
Как это устроено:
- При создании виджета выдаётся HMAC-секрет (префикс
widsk_). Он хранится только на вашем сервере и в браузер не попадает. - Ваш сервер считает подпись:
userHash = HMAC-SHA256(HMAC-секрет, userId), результат — шестнадцатеричная строка в нижнем регистре. userIdиuserHashпередаются виджету — параметрами в адресе сниппета либо черезwindow.fixorixWidget.init({ ... }).- Fixorix сверяет подпись и открывает чат от имени этого пользователя.
Если подпись не сошлась, чат всё равно откроется — но анонимно, как для обычного посетителя.
Сброс секрета
Кнопка «Сбросить секрет» есть в карточке виджета и на вкладке «Детали». Перед сбросом запрашивается подтверждение: «Текущий HMAC-секрет перестанет работать сразу после сброса. Продолжить?». Новый секрет показывается один раз — «Секрет сброшен. Сохраните новый — он показывается только один раз.».
Новый секрет действует сразу, но прежний остаётся рабочим до автоматического отзыва — это может занять несколько суток. Не полагайтесь на сброс как на мгновенную блокировку: обновите секрет в интеграции сразу.
Продолжение диалога
- Анонимный посетитель. Идентификатор диалога сохраняется в браузере, поэтому после перезагрузки страницы переписка продолжается. При очистке данных сайта или переходе в другой браузер начнётся новый диалог.
- Опознанный пользователь. Диалог один и тот же на любом устройстве и в любом браузере, где посетитель авторизован.
Ограничения
- Шапка чата зашита жёстко — «FXRX / Чат поддержки»; заменить её на свой логотип и название компании нельзя.
- Виджет предлагает только чат: обратного звонка, email-формы и формы «представьтесь перед чатом» в нём нет.
- Настроек рабочего времени и текста вне рабочего времени нет.
- Посетитель не может отредактировать или удалить своё сообщение.
- «Печатает…», реакции и отметки «доставлено» и «прочитано» в виджете не поддерживаются — как и в остальных каналах.
- Размеры и шрифты чата не настраиваются: панель имеет фиксированный размер и на узком экране раскрывается почти на всю ширину.
- Стили виджета нельзя переопределить со стороны сайта — он изолирован от вашего CSS, чтобы оформление страницы его не ломало.
Удаление
Иконка корзины в строке канала открывает подтверждение «Удалить виджет?» с предупреждением: «Это действие необратимо. Будут также удалены все HMAC-секреты виджета — интеграции, использующие их, перестанут идентифицировать пользователей.» После удаления канал исчезает из списка, а вставленный на сайт сниппет перестаёт открывать чат.
→ Каналы · Установка виджета · Поддержка