Мой сайт: виджеты на вашем собственном сайте

Раздел «Мой сайт» — для тех, у кого сайт уже есть. Не нужно переезжать на нашу витрину и что-то переносить: вы вставляете на существующий сайт одну строку кода и после этого включаете нужные продукты тумблерами в кабинете.

Открывается: Админ-панель → Маркетинг → «Мой сайт» (admin.cenaly.ru).

Работает на любой платформе, где можно вставить <script>: WordPress, Tilda, Wix, Shopify, Webflow, Bitrix, InSales, OpenCart, самописный сайт, лендинг конструктора.

Адрес сайта и код установки#

Первое поле раздела — адрес вашего сайта (например, example.com). По нему мы проверяем установку и строим правильные ссылки в виджетах.

Дальше — код установки. Это одна строка:

<script src="https://cdn.cenaly.ru/site/v1.js" data-domain="ВАШ-ДОМЕН" async></script>

Вставьте её один раз — в <head> или перед </body>. Больше к коду сайта возвращаться не нужно: состав виджетов задаётся тумблерами в кабинете, а не тегами на странице. Включили виджет — он появляется на сайте в течение нескольких минут, выключили — исчезает.

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

Установка на популярных платформах#

В окне «Код установки» есть вкладка под каждую платформу — с точными шагами. Ниже те же шаги коротко.

HTML-код#

Вставьте строку в <head> или перед </body> любой страницы шаблона. Если страниц несколько и общего шаблона нет — на каждую.

Google Tag Manager#

Теги → Создать → Пользовательский HTML → вставьте код → триггер «Все страницы» → Сохранить → Опубликовать. ⚠️ Тег, вставленный через GTM, наша «Проверка установки» не увидит (см. «Устранение неполадок»).

WordPress#

Внешний вид → Редактор файлов темы → footer.php, перед </body>. Либо — надёжнее при обновлениях темы — любой плагин вставки кода в header/footer.

Tilda#

«Настройки сайта» → «Ещё» (в части аккаунтов раздел называется «Вставка кода») → «HTML-код для вставки внутрь head». После вставки переопубликуйте все страницы — иначе код останется в черновике.

Wix#

Settings → Development & integrations → Custom Code → «+ Add Custom Code» → область Head, «на всех страницах». Свой код Wix разрешает на опубликованном сайте с подключённым доменом; сниппет привязан к домену — сменили домен, вставьте заново.

Shopify#

Админка → Интернет-магазин → Темы → ⋯ → Редактировать код → layout/theme.liquid → перед </body>.

Webflow#

Настройки сайта → Custom code → Footer code → Сохранить → Опубликовать.

Squarespace#

Website → Website Tools → Code Injection → поле Header → Save. Панель Code Injection доступна на планах Core, Plus, Advanced и части легаси-планов Squarespace.

Двенадцать виджетов#

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

Виджет	Что видит посетитель	Куда попадают данные	Документация
🍪 Cookies и согласие	Баннер согласия с категориями и экран настроек	Журнал согласий, декларация cookies	Cookies и согласие
💬 Чат: ИИ-ассистент и операторы	Пузырь чата на странице	Раздел «Чат» — вместе с WhatsApp, Telegram, email, Messenger/Instagram	Чат с гостями
💡 Попапы и формы	Промо, предложения при уходе, сбор email, таймеры	Кампании и их статистика	Кампании вовлечения
📅 Бронирование столика	Кнопка «Забронировать столик»	Раздел «Столы» — брони и схема зала	Брони столов
🗓️ Онлайн-запись	Кнопка «Записаться»: услуга → мастер → время	Раздел «Записи»	Журнал записи
🛒 Онлайн-заказ	Кнопка «Заказать», корзина и оформление поверх вашего сайта	Раздел «Заказы»	Онлайн-заказ на своём сайте
📚 Центр поддержки	Кнопка «?» с опубликованными статьями справки	Статьи — в «Статьи и страницы» (группа «Справка»), аналитика справки — в «Базе знаний»	Центр поддержки
⚖️ Юридические документы	Ссылки или текст политики конфиденциальности, условий и т. п.	Страницы на нашем хостинге, переиздание обновляет сайт само; настраивается прямо в панели виджета, без мастера	Юридические документы
📞 Звонок с сайта	Кнопка «Позвонить» — разговор прямо из браузера, без набора номера	Раздел «Звонки»: запись и разбор как у обычного звонка	Звонок с сайта
☎️ Обратный звонок	Форма «Перезвоните мне» с выбором удобного времени	Очередь перезвона: система сама набирает менеджера и гостя; заявки — в «Заявках» и во вкладке «Обратные звонки» раздела «Клиенты»	Обратный звонок
➕ Мультикнопка	Одна плавающая кнопка, за которой все каналы связи сразу	Туда, куда ведёт выбранный канал; в кабинете — статистика кликов по каналам	Мультикнопка
📈 Живая витрина	Ненавязчивые плашки «только что забронировали столик»	Ничего не собирает — только показывает ваши же события	Живая витрина

Порядок загрузки не случаен: cookie-баннер стартует первым, чтобы остальные виджеты и чужая аналитика на вашем сайте увидели уже применённое решение посетителя о cookies. По той же причине мультикнопка поднимается предпоследней: она собирает под себя уже включённые виджеты и гасит их собственные кнопки, чтобы в углу не толкались пять штук. «Живая витрина» идёт последней — её плашки отступают, если в том же углу уже стоит чья-то кнопка.

Мультикнопка — не просто список ссылок: у неё есть облачко-приглашение («Есть вопрос?»), условия показа (на каких страницах, через сколько секунд, только на телефоне или везде), заготовка первого сообщения для мессенджеров и своя статистика кликов по каналам.

«Живая витрина» показывает социальное доказательство на ваших собственных данных — заказах, бронях и записях, — и делает это честно: имён и телефонов в плашке нет, события агрегированы, а устаревшие перестают показываться по календарю заведения (закрытое вчера заведение не «продаёт» вчерашние заказы).

У карточки «Попапы и формы» рядом с тумблером и шестерёнкой стоит кнопка «✨ Создать из шаблона»: она открывает то же окно настроек виджета, но сразу галереей готовых сценариев — и ничего не сохраняет, пока вы не нажмёте «Готово».

Панель «Юридические документы» больше не отправляет в пятишаговый мастер: страна, набор документов, вопросы о вашей деятельности, реквизиты и язык лежат на одном экране, автозаполнение и предпросмотр свёрнуты, внизу — счётчик «Опубликовать документов: N». Опция, которая противоречит уже данным ответам, заперта с пояснением, почему именно.

Открытые окна хаба живут в адресе страницы: шестерёнка виджета пишет ?widget=<виджет>, окно кода установки — ?panel=install. Значит, ссылку на настройку конкретного виджета можно отправить коллеге, и она переживёт F5 и кнопку «назад».

Одному виджету мало тумблера — нужно ещё содержимое:

Онлайн-запись появится на сайте, когда в меню есть хотя бы одна позиция с типом «Услуга» и включено бронирование (тот же переключатель, что у брони столика);
Центр поддержки включается тумблером сразу, но без опубликованных статей откроет пустую страницу справки — в настройках виджета видно, сколько статей опубликовано.

Виджет онлайн-записи подробнее#

Настройки — карточка «Онлайн-запись» → шестерёнка: цвет кнопки, её текст, угол экрана и язык. Там же, под настройками, лежит готовая строка кода отдельно для этого виджета — на случай, если ставите только его.

Язык. По умолчанию — авто: виджет говорит на языке страницы, на которой стоит, и знает 45 языков. Словарь подгружается только тот, который понадобился, поэтому на скорость сайта это не влияет. В списке можно жёстко зафиксировать один язык — например, если сайт двуязычный, а записывать вы хотите на одном.

Ссылки на конкретную услугу или мастера. К тегу виджета можно дописать атрибуты — гость попадёт сразу на нужный шаг:

Атрибут	Что делает
`data-service="id услуги"`	услуга выбрана заранее — кнопка «Записаться» рядом с описанием услуги на вашем сайте. Идентификатор виден рядом с позицией в разделе «Меню»
`data-master="id мастера"`	мастер выбран заранее — для страницы конкретного специалиста; идентификатор мастера совпадает с идентификатором сотрудника
`data-open="true"`	панель записи открывается сама, без нажатия на кнопку — для отдельной страницы «Записаться»

Устаревший идентификатор (услугу переименовали, мастер уволился) виджет не ломает: он молча покажет обычный выбор с первого шага.

Меньше шагов до записи:

единственная услуга или единственный подходящий мастер — лишний экран не показывается;
чип «⚡ Ближайшее: сегодня 17:30» записывает в один тап, а календарь сам открывается на первом дне со свободным временем;
имя, телефон и почта запоминаются на устройстве гостя: при повторной записи поля уже заполнены, а ссылка «Не я» их стирает;
на телефоне панель открывается во весь экран, кнопка записи не прячется под клавиатурой;
виджетом можно пользоваться с клавиатуры, он корректно читается программой чтения с экрана.

Почта. Поле e-mail необязательное; оставил гость адрес — получит письмо с деталями визита и ссылкой «Управлять записью», по которой сам перенесёт или отменит визит. Подробности — в разделе Журнал записи.

Что дал виджет. В журнале записи кнопка «🌐 Виджет на сайте» показывает воронку за 7, 30 или 90 дней: сколько раз кнопку увидели, сколько гостей открыло панель, дошло до контактов и записалось, сколько записей потеряно из-за занятого времени. У самих записей с сайта стоит бейдж «С сайта».

Проверка установки#

Кнопка «Проверить установку» открывает ваш сайт и читает исходный HTML страницы. В ответе:

«Код виджетов найден на сайте» — единый тег на месте;
«Найдены только отдельные теги виджетов» — работают старые одиночные вставки, единого тега нет;
«Код на сайте принадлежит другой локации» — в теге чужой data-domain (частая ошибка при нескольких заведениях);
«На этой странице кода виджетов нет» — тега не видно.

⚠️ Проверка читает исходный HTML. Если тег вставляет уже в браузере Google Tag Manager или другой скрипт, проверка его не увидит — это не ошибка. Откройте сайт и посмотрите глазами: виджет либо есть, либо нет.

Под карточками виджетов в разделе есть ещё два блока: «Витрина на своём коде (Headless)» — данные, API и вебхуки для случая, когда сайт пишет ваш разработчик и наши виджеты ему не нужны, — и «Продвинутое: отдельный тег на каждый виджет» с готовыми одиночными тегами. То есть одиночный тег можно не только «донести из прошлого», но и взять здесь же.

Устранение неполадок#

Общий список для всех двенадцати виджетов — от самой частой причины к редким. Специфика конкретного виджета описана в его статье.

1. «Проверка установки» говорит, что кода нет. Тег не вставлен, вставлен не на все страницы шаблона или сайт после вставки не опубликован (Tilda, Wix, Webflow требуют повторной публикации). Проверьте и адрес сайта в шапке раздела: проверка ходит именно по нему.

2. Код на сайте принадлежит другой локации. В теге стоит чужой data-domain — частая ошибка, когда заведений несколько и код скопировали из соседней карточки. Возьмите код при выбранной нужной локации.

3. Проверка не видит тег, вставленный через Google Tag Manager. Это не ошибка. Проверка читает исходный HTML страницы — то, что отдал сервер, — а GTM подставляет тег уже в браузере. Откройте сайт и посмотрите глазами: виджет либо есть, либо нет.

4. Изменения не появились на сайте. Файлы виджетов раздаются через CDN с кэшем 5 минут. После включения тумблера или правки настроек подождите несколько минут и обновите страницу с очисткой кэша (Ctrl+F5). Если браузер упорно показывает старое — проверьте в режиме инкогнито.

5. Виджет включён, но на странице его не видно. Пройдите по списку:

виджет платный и не оплачен — неоплаченное расширение вырезается из данных сайта на сервере, поэтому на страницу оно не попадёт даже при включённом тумблере;
у виджета есть условия показа (мультикнопка, обратный звонок, «Живая витрина»): маска страниц, задержка, фильтр устройства или расписание могли отсечь именно эту страницу и этот момент;
виджету не хватает содержимого: онлайн-запись появляется, когда в меню есть хотя бы одна позиция-услуга и включено бронирование; центр поддержки без опубликованных статей откроет пустую панель; мультикнопка без единого канала не рисуется вовсе; «Живая витрина» молчит, пока числа ниже порога;
мультикнопка поглотила кнопку соседа: если в её веере есть пункт «Открыть чат» или «Обратный звонок», собственные кнопки этих виджетов гасятся намеренно — они теперь внутри веера.

6. В углу экрана толкаются несколько кнопок. Включите мультикнопку и добавьте в её веер действия нужных виджетов — их отдельные кнопки погаснут сами.

7. Виджетов нет на сайте, сделанном нашим конструктором. Там код установки вшит в шаблон, и блок с кодом в кабинете не показывается — это нормально. Проверяйте тумблеры виджетов: новый сгенерированный сайт приезжает с включёнными cookie-баннером, юрдокументами и чатом, остальное включается вручную. Учтите и различия поверхностей: мультикнопка на нашей витрине показывается только по отдельному тумблеру «Показывать и на нашей витрине» (она поглощает нативные кнопки страницы), а «Живая витрина» работает тем же одним тумблером, что и на чужом сайте.

Сайт с Content-Security-Policy#

Если ваш сервер отдаёт заголовок Content-Security-Policy, браузер сам решает, что нашему коду установки разрешено загрузить. Сам тег при этом работает — вы его разрешили, — а всё, что он подтягивает, может быть заблокировано молча: снаружи это выглядит как «виджеты пропали». В консоли браузера при этом видны строки вида Refused to load the script.

Разрыв возникает ровно в одном режиме: политика разрешает скрипты только по одноразовому nonce, без 'strict-dynamic' и без хоста нашего CDN в списке. Ниже — три способа это закрыть, от самого простого.

Вариант 1 — nonce на нашем теге#

Ваш сервер генерирует новое случайное значение на каждый ответ, ставит его и в заголовок, и в тег:

Content-Security-Policy: script-src 'nonce-r4nd0m...'

<script nonce="r4nd0m..." src="https://cdn.<ваш бренд>/site/v1.js" data-domain="ВАША-ЛОКАЦИЯ" async></script>

Единый тег читает nonce своего тега и передаёт его каждому бандлу виджета, который вставляет, — они проходят ту же проверку. Ничего дополнительно разрешать не нужно.

⚠️ Постоянное значение, одинаковое на всех ответах, — это не nonce: его скопирует в свой скрипт любой, кто сумел вставить код на страницу. Генерируйте на каждый ответ, на сервере.

Вариант 2 — `'strict-dynamic'`#

Content-Security-Policy: script-src 'nonce-r4nd0m...' 'strict-dynamic'

С 'strict-dynamic' доверие к нашему тегу распространяется на скрипты, которые он вставляет, и перечислять больше ничего не нужно. Это самая короткая политика, при которой работают все виджеты, включая ленивые части «Умных попапов».

Вариант 3 — список хостов#

Если nonce вам недоступен (так бывает на конструкторах сайтов), разрешите наши хосты явно:

Content-Security-Policy: script-src https://cdn.<ваш бренд>;
  connect-src https://cdn.<ваш бренд> https://api.<ваш бренд> wss://ws.<ваш бренд> https://o.<ваш бренд>;
  img-src https://cdn.<ваш бренд> https://i.<ваш бренд>;
  frame-src https://cdn.<ваш бренд> https://ваша-локация.<ваш бренд>;
  style-src 'unsafe-inline'

Готовый сниппет с подставленными хостами вашего бренда и вашей локации есть в кабинете: Маркетинг → Мой сайт, блок «Сайт с Content-Security-Policy?» под кодом установки — там же кнопка «Скопировать» и пометка, какому виджету нужен каждый хост.

Что кому нужно:

Директива	Кому нужна
`script-src`	Всем виджетам: бандлы с нашего CDN
`connect-src`	Всем: заявки, брони, записи, заказы, телеметрия; чату — вебсокет и бакет сигналов
`img-src`	Заказу: фотографии товаров и блюд
`frame-src`	Заказу, центру поддержки и юридическим документам: они открывают вашу витрину в `<iframe>`
`style-src`	Всем: окна виджетов вставляют `<style>` в свой Shadow DOM

Чего это не покрывает — честно#

Стили. Оформление окон — инлайновый <style> внутри Shadow DOM, поэтому нужен style-src 'unsafe-inline'. На script-src это не влияет: скриптам мы 'unsafe-inline' и 'unsafe-eval' не просим.
Ленивые части «Умных попапов» (engage/rich-v1.js, engage/slots-v1.js) грузятся своим загрузчиком и nonce пока не несут: при политике только с nonce, без хоста нашего CDN, расширенные попапы и слоты не поднимутся. Части баннера согласия, мобильного бара мультикнопки и перехвата форм nonce получают.
Конструкторы сайтов (Tilda, Wix и подобные) отдают заголовок сами, и одноразовый nonce своему тегу вы там не выпишете. Остаётся вариант со списком хостов — если платформа вообще даёт править политику.
Звонок с сайта передаёт звук потоком WebRTC и не грузит медиафайлы, поэтому media-src ему не нужен; микрофон разрешают Permissions-Policy и HTTPS, а не CSP.

Вынести виджет отдельным разделом#

Если один из виджетов — ваш основной продукт (например, вы пользуетесь только попапами или только cookie-баннером), путь «Маркетинг → Мой сайт → карточка → шестерёнка» слишком длинный. На карточке есть кнопка «Вынести в сайдбар» — виджет получит собственный пункт меню и откроется в один клик.

Это настройка вашего интерфейса: она управляет только видимостью раздела, а не работой виджета на сайте.

Что бесплатно, а что платное расширение#

Часть виджетов входит в подписку, часть подключается как расширение в разделе «Расширения»: платными помечены Бронирование, Попапы и формы, Центр поддержки и Юридические документы — на карточке стоит чип «💳 Платное расширение».

Платный виджет включается после покупки. Нажатие на тумблер у неоплаченного виджета не включает его, а открывает окно оплаты прямо в разделе; после оплаты виджет включается сам. Чип «💳 Платное расширение» у неоплаченного виджета — тоже кнопка оплаты, а у уже оплаченного он ведёт в каталог посмотреть подписку. Уже работающий виджет сам не отключится. Ограничение не только в интерфейсе: неоплаченный виджет вырезается из публикуемых данных локации, поэтому на сайте он не появится в любом случае.

На сайте, сделанном нашим конструктором, «Юридические документы» и cookie-баннер бесплатны. На их карточках вместо «платного» стоит чип «🎁 Входит в сайт», и окно оплаты не показывается вовсе: это не апселл, а условие, при котором сайтом законно пользоваться. Новый сгенерированный сайт сразу приезжает с включёнными cookie-баннером, юрдокументами и чатом. На чужом сайте оба виджета остаются платными расширениями.

Тарифы и оплата — в разделе Магазин приложений и Подписка.

Связанные разделы#

Конструктор сайта — если своего сайта нет и нужна наша витрина
Витрина на своём коде (headless) — если сайт пишет ваш разработчик, а данные берёт у нас
Свой домен — подключение собственного домена к нашей витрине

Частые вопросы#

Нужно ли отказываться от своего сайта? Нет. Виджеты живут поверх вашего сайта, вёрстку и хостинг вы не меняете.

Сколько тегов вставлять, если виджетов несколько? Один. Состав виджетов — тумблеры в кабинете.

Замедлит ли виджет сайт? Загрузчик подключается асинхронно (async) и не блокирует отрисовку страницы; каждый виджет грузится отдельным небольшим файлом и только если он включён. Выключенный виджет не скачивается вовсе.

Сломает ли виджет вёрстку? Нет. Каждый виджет рисуется в изолированном контейнере (Shadow DOM): стили вашего сайта не протекают внутрь виджета, а стили виджета — наружу. Исключение по замыслу — виджет онлайн-заказа: он специально ставит кнопки «В корзину» в вашу разметку, и это настраивается с превью (см. Онлайн-заказ на своём сайте).

На каком языке заговорит виджет? Он смотрит на язык страницы: сначала атрибут data-lang в теге, если вы его задали, затем lang вашей HTML-страницы, затем язык браузера гостя, а в крайнем случае — английский. Словари разного размера: cookie-баннер и виджет онлайн-записи знают 45 языков, чат — 35, у остальных встроены английский, русский, грузинский и турецкий с падением на английский. Подписи кнопок и приглашения вы задаёте сами — отдельной строкой для каждого языка сайта.

Где хранятся данные, которые собирают виджеты? В облаке вашего бренда: у cenaly.com — AWS, у cenaly.ru — Yandex Cloud; данные российских заведений остаются в России. Заявки, заказы, брони и переписки попадают в ваш кабинет, а на публичный CDN уезжают только настройки виджетов и то, что и так публично (меню, часы работы, опубликованные документы, обезличенные числа «Живой витрины»).

У меня несколько заведений — как быть? Виджеты настраиваются на локацию: выберите её в списке вверху раздела и возьмите её код установки. У каждого сайта — свой data-domain.

Можно ли поставить виджеты на несколько разных сайтов? Да, тег одной локации можно вставить на несколько страниц или сайтов — данные придут в одну локацию.

🧩 Мой сайт