Разделы документации

Все параметры конфигурации виджета: внешний вид, тексты, язык, поведение, маршрутизация, события.

Параметры конфигурации

Параметры задаются в объекте SvyazioConfig в коде установки — до того, как загрузится svyazio.js. Любой параметр необязателен, кроме orgId. Всё, что указано здесь, действует только на этой странице и главнее настроек из панели управления.

Код установки со всеми группами параметров
<script>
  (function(d, w, c) {
    w.SvyazioConfig = {
      orgId: "ВАШ_ORG_ID",
      serverUrl: "https://app.svyazio.ru",

      // внешний вид
      skin: "aurora",
      accentColor: "#0F8770",
      buttonPosition: "br",
      chatWidth: 380,

      // тексты этой страницы
      headerText: "Отдел продаж",
      welcomeText: "Подберём тариф и ответим на вопросы по оплате.",

      // поведение
      deferredLoading: true,
      groupId: "ID_ОТДЕЛА_ПРОДАЖ",

      // события
      onNewMessage: function(message) {
        console.log("Новое сообщение:", message.text);
      }
    };
    w[c] = w[c] || function() {
      (w[c].q = w[c].q || []).push(arguments);
    };
    var s = d.createElement('script');
    s.async = true;
    s.src = 'https://app.svyazio.ru/widget/svyazio.js';
    if (d.head) d.head.appendChild(s);
  })(document, window, 'Svyazio');
</script>

Обязательный

ПараметрТипЧто делает
orgIdstringID вашей организации. Уже подставлен в код установки (Настройки → Установка). Без него виджет не запускается.

Внешний вид

ПараметрТипПо умолчаниюЧто делает
skin'classic''aurora''soft'из панелиОформление виджета. Неизвестное значение игнорируется — остаётся оформление из панели (Настройки → Виджет).
theme'light''dark'из панели, иначе как в системеСветлая или тёмная тема окна. Определяется один раз при загрузке страницы.
accentColorstringиз панелиФирменный цвет: кнопка, шапка, сообщения посетителя. Только HEX из шести цифр — #0F8770. red и rgb() виджет не принимает и красится в запасной #6C5CE7; короткая запись #0a7 проходит проверку, но ломает градиент кнопки (см. «Цвет не применился»).
colorsobjectТочечные цвета: buttonBg, buttonText, clientBubbleBg, agentBubbleBg. buttonBg главнее accentColor. Подробно — в описании setColors.
buttonPositionstringиз панели (справа снизу)Где стоит кнопка чата — один из девяти кодов, таблица ниже. Окно открывается рядом с кнопкой.
buttonSizenumber60Диаметр кнопки чата в пикселях.
chatWidthnumber400Ширина окна чата, px. Минимум 280. На экранах до 600 px окно всегда открывается на весь экран.
chatHeightnumber600Высота окна чата, px. Минимум 300.
zIndexnumber999999Слой виджета. Поменяйте, если его перекрывают элементы сайта: шапка, баннер cookie.

Коды позиций кнопки

КодГде кнопка
brсправа снизу
bcснизу по центру
blслева снизу
rtсправа сверху
rmсправа посередине
rbсправа снизу (как br)
ltслева сверху
lmслева посередине
lbслева снизу (как bl)

Первая буква — сторона экрана (b — низ, l — лево, r — право), вторая — место на ней (t — верх, m — середина, b — низ, c — центр). На телефоне отступ от края меньше — 16 px вместо 24.

Тексты

Заменяют тексты из панели только на этой странице — удобно, когда на разных разделах сайта нужен свой заголовок или приветствие.

ПараметрТипЧто делает
headerTextstringЗаголовок окна чата.
onlineTitlestringПодзаголовок в рабочее время (по расписанию из панели).
offlineTitlestringПодзаголовок в нерабочее время.
welcomeTextstringПриветствие в пустом чате — когда идёт рабочее время и в сети есть хотя бы один оператор.
offlineTextstringТекст в пустом чате, когда рабочее время закончилось или операторов нет в сети.

Язык

ПараметрТипПо умолчаниюЧто делает
localestringobjectиз панелиСтрока — язык интерфейса: ru, en, es, pt, de, fr, tr. Объект — замена отдельных надписей. Подробно — в разделе «Язык и тексты».
languagestringСиноним locale для строкового значения — оставлен для совместимости с Chatra. В новых интеграциях используйте locale.

Поведение и показ

ПараметрТипПо умолчаниюЧто делает
startHiddenbooleanfalseЗагрузить виджет скрытым: ни кнопки, ни автооткрытия. Показать — show или openChat.
customWidgetButtonstringCSS-селектор вашей кнопки. Клик по ней открывает чат, стандартная кнопка прячется. Подробно — в разделе «Своя кнопка».
disabledOnMobilebooleanfalseНе запускать виджет на телефонах и планшетах.
mobileOnlybooleanfalseЗапускать виджет только на телефонах и планшетах.
deferredLoadingbooleanfalseСтартовать после полной загрузки страницы (событие load) — картинки и скрипты сайта грузятся первыми.
disableChatOpenHashbooleanfalseНе трогать адресную строку: виджет перестаёт следить за ссылками #svyazioChatExpanded и не добавляет этот хеш на телефонах.

Маршрутизация

ПараметрТипПо умолчаниюЧто делает
groupIdstringID отдела, в который попадут обращения со страницы. Скопировать ID — Настройки → Отделы, иконка рядом с названием. ID чужой организации сервер игнорирует.
groupIDstringТо же, что groupId: внутреннее имя параметра, его показывает справка в кабинете. Если заданы оба, побеждает groupId.

События

ПараметрТипПо умолчаниюЧто делает
onNewMessagefunction(message)Вызывается на каждое новое сообщение оператора или бота. См. «События и аналитика».
onAnalyticEventfunction(name)События для вашей аналитики: загрузка виджета и открытие чата.

Служебные

ПараметрТипПо умолчаниюЧто делает
serverUrlstringадрес скриптаАдрес сервера Связио. Уже прописан в коде установки, менять не нужно. Если не указан, берётся из адреса, откуда загружен svyazio.js.
position'right''bottom-left'из панелиУстаревшая упрощённая позиция из первых версий. Если задан buttonPosition, действует он.

Объявлено, но не работает

В типах конфигурации есть два ключа, которые виджет не читает: buttonStyle (кнопка всегда круглая) и clientId (привязку к аккаунту делайте через данные посетителя). Ошибок они не вызывают, но и эффекта не дают.

Обновлено 22 сентября 2026