Конфигурация
Поведение виджета задаётся одним объектом конфигурации. Его дефолты зашиты в бандл на этапе сборки (widget.config.js), а хост-страница может переопределить нужные ключи в рантайме.
Приоритет разрешения
От низшего к высшему (побеждает верхний):
widget.config.js— build-time дефолты, зашитые в бандл.<script data-mz-*>— атрибуты на загружающем теге.window.MZBOT_CONFIG = {…}— глобальный объект (задаётся до загрузки бандла).<html data-mz-theme>— живой атрибут на<html>(только тема; отслеживаетсяMutationObserver).MZBOT.setTheme(…)— вызовы JS-API в рантайме.
TIP
Для режимов встраивания (inline/static/overlay/button/offset) приоритет: <script data-mz-*> → window.MZBOT_CONFIG → widget.config.js. Для темы добавляются ещё два верхних уровня — <html data-mz-theme> и MZBOT.setTheme(...).
Три способа задать конфиг на хосте
html
<!-- 1) атрибуты загружающего скрипта -->
<script src="bundle.min.js" data-mz-theme="dark" data-mz-accent="#0dbb52" defer></script>
<!-- 2) глобальный объект (до бандла) -->
<script>window.MZBOT_CONFIG = { theme: { mode: 'dark' }, chat: { position: 'lb' } };</script>
<script src="bundle.min.js" defer></script>
<!-- 3) живой атрибут темы на <html> -->
<html data-mz-theme="dark">Справочник ключей
Идентичность и endpoints
| Ключ | Тип | По умолчанию | Описание |
|---|---|---|---|
USER_UUID | string | — | Идентификатор клиента/бота на бэкенде. |
API_HOST | string | https://api.assistant.morze.tech | HTTP-эндпоинт Router'а. |
WS_HOST | string | wss://api.assistant.morze.tech/ws/ | WebSocket-эндпоинт. |
bitrix24 | boolean | false | Режим Bitrix24-плейсмента: пробрасывать авторизацию портала на каждый /msg и /action. |
Дефолт указывает на прод
Для локальной разработки с morzebot-backend-v2 (:9000) переопределите API_HOST/WS_HOST (в коде закомментированы локальные варианты в widget.config.js).
theme — визуальная тема
| Ключ | Значения | По умолчанию | Описание |
|---|---|---|---|
mode | light | white | dark | auto | dark | Цветовая схема (auto следует за ОС). |
accent | CSS-цвет | #9162e4 | Акцентный цвет — управляет всеми тематическими элементами. |
pattern | none | whisper | mesh | scales | bloom | cipher | prism | whisper | SVG-паттерн фона области чата. |
patternOpacity | 0..1 | 0.05 | Прозрачность паттерна. |
patternScale | 0.25..4 | 1.3 | Масштаб паттерна. |
bgColors | массив цветов | CSS-строка | — | Кастомный фон чата (см. Темизацию). |
bgAngle | градусы | 160 | Угол градиента. |
patternImage | URL | — | Бесшовное изображение-оверлей поверх фона. |
patternImageOpacity | 0..1 | 1 | Прозрачность изображения. |
patternImageSize | px | CSS background-size | — | Размер тайла. |
msgAnimation | bubble | unfurl | cascade | pop | breathe | bubble | Анимация входящих сообщений. |
glow.dark / glow.light | boolean | false / true | Акцентное свечение по разрешённой теме. |
glow.intensity | 0.1..5 | 0.2 | Сила свечения. |
Подробности — на странице Темизация.
chat — раскладка и поведение
| Ключ | Значения | По умолчанию | Описание |
|---|---|---|---|
type | 1 | 0 | 1 | 1 = плавающая кнопка-лаунчер, 0 = полосный header. |
position | rb | lb | rb | Угол: право-низ / лево-низ. |
closedButton | blob | simple | simple | Стиль закрытой кнопки (только type:'1'). |
lockScrollMobile | boolean | true | Блокировать скролл хоста на мобильных при открытом чате. |
sound | boolean | false | Мастер-переключатель звука уведомлений. false убирает и пункт меню. |
notifySound | URL | https://cdn.morze.tech/notify.mp3 | Звук при входящем в закрытом чате. '' отключает. |
messengers | массив | [telegram, vk] | Кнопки мессенджеров, разлетающиеся вокруг лаунчера на ховере. |
inline | boolean | false | Inline-режим — лаунчер в потоке страницы. Требует container. |
container | CSS-селектор | null | Хост-элемент для монтирования (фолбэк <body>). |
button.shape | circle | square | square | Форма simple-кнопки (blob игнорирует). |
button.size | px | 50 | Размер кнопки. |
offset.x / offset.y | px | 44 / 8 | Отступ открытой карточки от края вьюпорта. |
static | boolean | false | Статичный докнутый режим. Требует container. |
staticHeight | px | CSS-длина | '100%' | Высота статичной панели. |
staticMaxWidth | px | CSS-длина | null | null | Кап ширины статичной панели. |
overlay.enabled | boolean | false | Смонтировать overlay-поверхность. |
overlay.startVisible | boolean | false | Лаунчер overlay виден сразу. |
overlay.position | rb | lb | rb | Угол overlay-лаунчера. |
Режимы подробно — на странице Режимы встраивания.
messengers[]
js
messengers: [
{ type: 'telegram', url: 'https://t.me/morzetech' },
{ type: 'vk', url: 'https://vk.com/morzetech' },
// кастом: любой мессенджер через icon URL
{ type: 'viber', url: 'viber://chat?number=%2B7...', icon: 'https://cdn.example.com/viber.svg', color: '#7360F2', label: 'Viber' },
]type—whatsapp|telegram|vk|maxимеют встроенные иконки и брендовые цвета; любой другой тип — кастом, требуетicon.url— ссылка (открывается в новой вкладке).color,icon,label— опциональны.- Пустой массив = фича выключена.
bot — личность бота
| Ключ | Тип | По умолчанию | Описание |
|---|---|---|---|
avatar | URL | https://cdn.morze.tech/morze-avatar-blue.png | Аватар бота. |
title | string | Morze Assistant | Заголовок открытого чата. |
titleClosed | string | Могу вам помочь | Подпись на закрытой кнопке. |
responseDelay | ms | 1200 | Искусственная задержка перед показом входящего (показывается «печатает…»). 0 отключает. |
tips | string[] | — | Быстрые подсказки-реплики. |
Полный список data-mz-* атрибутов
data-mz-theme data-mz-accent data-mz-pattern
data-mz-msg-animation data-mz-bg-colors data-mz-bg-angle
data-mz-pattern-image data-mz-pattern-image-opacity data-mz-pattern-image-size
data-mz-container data-mz-inline data-mz-static
data-mz-static-height data-mz-static-max-width
data-mz-overlay data-mz-overlay-start-visible data-mz-overlay-position
data-mz-sound data-mz-button-shape data-mz-button-size
data-mz-offset-x data-mz-offset-ydata-mz-bg-colors
Принимает строку с цветами через запятую: data-mz-bg-colors="#1b2735,#283e51,#0a1622".