Виджет для сайта

Как включить виджет, указать домен, настроить цвет, скопировать код и создать отдельный код под город.

Что такое виджет

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

Настройка и код находятся в личном кабинете владельца: раздел Инструменты продвижения (вкладки «Виджет», «Настройки», «Условия»). Доступен только с ролью «Владелец».

Shadow DOM

Виджет работает через Shadow DOM — стили вашего сайта и виджета не смешиваются. Удобнее размещать его на отдельной странице каталога.

Настройки: домен и режимы

Перед вставкой кода откройте Настройки в разделе «Инструменты продвижения».

  1. Включите виджет — пока он выключен, код на сайте не покажет каталог.
  2. Укажите адрес сайта в формате https://example.com или с кириллическим доменом (https://мойсайт.рф). Только HTTPS, без www, пути и порта.
  3. Выберите режимы отображения: список, карта или оба. Хотя бы один режим должен остаться включённым.
  4. Нажмите Сохранить.
Защита по домену

Без разрешённого домена виджет на чужом сайте не заработает. Используйте только код из личного кабинета — параметр sig защищает виджет от подмены.

Кастомизация цвета

Во вкладке Настройки задайте цветовую схему виджета. Цвет применяется к кнопке «В корзину», значкам избранного и корзины в шапке, а также к меткам на карте.

Кастомизация виджета: выбор цвета и предпросмотр
Готовые схемы или свой HEX — изменения сразу видны в предпросмотре.
  • Выберите одну из готовых схем: оранжевый, синий, зелёный, красный, фиолетовый.
  • Или укажите свой цвет в формате HEX (например, #63a611) либо выберите оттенок в палитре.
  • Слишком светлые оттенки недоступны — белый текст на них не читается.
  • Предпросмотр обновляется сразу; на сайте цвет появится после Сохранить.

Код для сайта

Во вкладке Виджет скопируйте код и вставьте его в HTML вашей страницы.

Код для сайта: HTML-блок виджета со списком и картой
Форматы: HTML для вставки на сайт или ссылка для быстрой проверки.
  • HTML — блок <div> и скрипт с параметрами владельца. Вставьте на страницу каталога.
  • Ссылка — откройте превью виджета в браузере, чтобы проверить список и карту до публикации на сайте.
Порядок запуска

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

Отдельный код под город

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

Редактирование кода региона: локация и карта
Редактирование кода региона: выбор локации и настройка области карты.
  1. Во вкладке Виджет создайте новый код региона.
  2. На шаге Локация выберите федеральный округ, область или город.
  3. На шаге Карта подстройте область просмотра или найдите адрес. При сохранении используется текущая область карты.
  4. Сохраните — появится отдельный HTML и ссылка для этого региона.
Несколько страниц на сайте

На страницу «Москва» вставьте код московского региона, на страницу филиала — код этого города. Базовый код без региона показывает весь каталог владельца.

См. также