Конфигурация
Поведение виджета задаётся одним объектом конфигурации. Его дефолты зашиты в бандл на этапе сборки, а хост-страница может переопределить нужные ключи в рантайме.
Приоритет разрешения
От низшего к высшему (побеждает верхний):
- Дефолты бандла — build-time значения, зашитые при сборке.
<script data-mz-*>— атрибуты на загружающем теге.window.MZBOT_CONFIG = {…}— глобальный объект (задаётся до загрузки бандла).<html data-mz-theme>/<html data-mz-lang>— живые атрибуты на<html>(тема и язык; отслеживаютсяMutationObserver).MZBOT.setTheme(…)/setLang(…)/setTips(…)— вызовы JS-API в рантайме.
TIP
Для режимов встраивания (inline/static/overlay/button/offset) приоритет: <script data-mz-*> → window.MZBOT_CONFIG → дефолты бандла. Для темы и языка добавляются ещё два верхних уровня — живой атрибут на <html> и вызов JS-API. Для подсказок верхний уровень — MZBOT.setTips(...) (живого атрибута нет).
Три способа задать конфиг на хосте
<!-- 1) атрибуты загружающего скрипта -->
<script src="bundle.min.js" data-mz-theme="dark" data-mz-accent="#0dbb52" defer></script>
<!-- 2) глобальный объект (до бандла) -->
<script>window.MZBOT_CONFIG = { theme: 'dark', accent: '#0dbb52', bgColors: { light: ['#eef2ee'], dark: ['#1b2735'] } };</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. |
Задаётся только при сборке
USER_UUID, API_HOST и WS_HOST зашиваются в бандл на стороне Morze и не переопределяются с хост-страницы — ни атрибутами data-mz-*, ни через window.MZBOT_CONFIG.
lang — язык интерфейса
| Ключ | Значения | По умолчанию | Описание |
|---|---|---|---|
lang | ru | en | ru | Язык всего интерфейса виджета: плейсхолдер ввода, меню, статусы, экраны ошибок, aria-подписи. |
Как и тема, язык живёт по расширенному приоритету (сверху — выше): MZBOT.setLang(...) → <html data-mz-lang> (живой атрибут) → window.MZBOT_CONFIG.lang → <script data-mz-lang> → значение из бандла → ru.
<html data-mz-lang="en">
<script src="bundle.min.js" data-mz-lang="en" defer></script>Подробнее — MZBOT.setLang().
theme — визуальная тема
| Ключ | Значения | По умолчанию | Описание |
|---|---|---|---|
mode | light | white | dark | auto | dark | Цветовая схема (auto следует за ОС). |
design | default | glass | default | Язык оформления поверх темы; glass — гласморфизм с оттенком accent (см. Темизацию). |
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-строка | {light, dark} | — | Кастомный фон чата (см. Темизацию). |
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 | Сила свечения. |
Любой ключ фона (pattern, patternOpacity, patternScale, bgColors, bgAngle, patternImage, patternImageOpacity, patternImageSize) принимает либо одно значение на обе темы, либо карту { light, dark } — ветка выбирается по активной теме и переприменяется при её переключении. См. Два фона: светлая и тёмная тема.
Подробности — на странице Темизация.
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 | Звук при входящем в закрытом чате. '' отключает. |
voice | boolean | true | Кнопка микрофона (голосовые). false — кнопки нет, диктофон не монтируется. |
attachments | boolean | true | Кнопка-скрепка (файлы). false — кнопки нет, file-input не создаётся. |
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[]
messengers: [
{ type: 'telegram', url: 'https://t.me/morzetech' },
{ type: 'vk', url: 'https://vk.com/morzetech' },
{ type: 'ok', url: 'https://ok.ru/profile/574368901092' },
{ type: 'instagram', url: 'https://www.instagram.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|ok|instagramимеют встроенные иконки и брендовые цвета; любой другой тип — кастом, требуетicon. Алиасы:odnoklassniki→ok,insta→instagram. Регистр не важен.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[] | карта языков | — | Быстрые подсказки-реплики в пустом чате. |
Любой из этих ключей (кроме responseDelay) можно задать картой по языкам — она пересчитывается при смене языка:
bot: {
title: { ru: 'Morze Ассистент', en: 'Morze Assistant' },
tips: { ru: ['Тарифы', 'Кейсы'], en: ['Pricing', 'Case studies'] },
}tips дополнительно меняются с хост-страницы — атрибутом data-mz-tips, ключом window.MZBOT_CONFIG.tips или в рантайме через MZBOT.setTips(). Остальные строки — через MZBOT.setBotContent().
Полный список data-mz-* атрибутов
data-mz-theme data-mz-design 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-voice data-mz-attachments
data-mz-button-shape data-mz-button-size
data-mz-offset-x data-mz-offset-y
data-mz-lang data-mz-tipsdata-mz-bg-colors
Принимает строку с цветами через запятую: data-mz-bg-colors="#1b2735,#283e51,#0a1622".
Суффиксы -light / -dark
Любой атрибут фона (data-mz-pattern, data-mz-pattern-opacity, data-mz-pattern-scale, data-mz-bg-colors, data-mz-bg-angle, data-mz-pattern-image*) можно задать отдельно для каждой темы: data-mz-bg-colors-light="…" + data-mz-bg-colors-dark="…". Атрибут без суффикса остаётся значением для темы, которую не задали явно.
data-mz-tips
Принимает JSON-массив (data-mz-tips='["Тарифы","Кейсы"]'), а если значение не JSON — строку с разделителем | (data-mz-tips="Тарифы|Кейсы").