Оформление и шаблоны виджетов

Управляйте тем, как каждый виджет Umbrella выглядит и работает на витрине вашего магазина. Выберите тип виджета на боковой панели, а затем настройте его на трёх вкладках:

• Настройки — включение функций, выбор режима отображения, управление видимостью
• Шаблон — редактирование HTML и CSS в редакторе кода
• Языки — управление строками перевода для поддержки нескольких языков

Типы виджетов

Страница товара (PDP)

• Виджет PDP — основная карточка с гарантийным предложением на страницах товаров
• Виджет PDP OEM — информация о гарантии производителя
• Модальное окно выбора — всплывающее окно для выбора вариантов гарантии
• Информационное модальное окно — всплывающее окно с подробностями гарантийной защиты

Корзина

• Корзина: защищено — карточка статуса для товаров с гарантийной защитой
• Корзина: без защиты — карточка допродажи для товаров без гарантийной защиты

Статус заказа

• Виджет статуса заказа — сведения о гарантии на страницах подтверждения и статуса заказа
• Модальное окно статуса заказа — подробное модальное окно гарантии со страницы статуса заказа

После покупки

• Карточка после покупки — допродажа гарантии на страницах статуса заказа для товаров без покрытия
• Модальное окно после покупки — модальное окно выбора для допродаж после покупки

Защита доставки

• Виджет защиты доставки — предложение защиты доставки на странице корзины
• Модальное окно защиты доставки — информационное модальное окно с подробностями защиты доставки

Настройки виджета PDP

Основное гарантийное предложение на страницах товаров. Включите или отключите его переключателем Включить карточку PDP.

Режим отображения

Только для встроенного режима

• Обязательный выбор — покупатель должен выбрать вариант гарантии, прежде чем добавить товар в корзину
• Автовыбор первого варианта — первый план выбран заранее (покупатель может изменить выбор или отказаться)
• Показывать вариант «Без покрытия» — отображать вариант «Нет, спасибо» для явного отказа

Дополнительные параметры

• Открывать модальное окно при добавлении в корзину — если гарантия не выбрана, перед добавлением товара показывается модальное окно
• Свой селектор вставки — CSS-селектор, определяющий, где на странице размещается виджет
• Позиция вставки — снаружи сверху, внутри сверху, внутри снизу или снаружи снизу
• Использовать собственный шаблон — использовать собственные HTML/CSS вместо стандартного дизайна
• Скрыть брендинг Umbrella — убрать нижнюю строку «Powered by Umbrella»

Настройки виджета PDP OEM

Показывает информацию о гарантии производителя (OEM) на страницах товаров отдельно от предложений расширенной гарантии.

• Включить виджет OEM — показать или скрыть виджет OEM
• Скрыть сведения о покрытии — скрыть подробное описание покрытия
• Скрыть срок гарантии — скрыть отображение срока гарантии
• Использовать собственный шаблон / Скрыть брендинг Umbrella

Настройки модального окна выбора

Всплывающее окно с вариантами гарантии. Открывается из виджета PDP, из корзины или при добавлении товара в корзину.

• Включить модальное окно выбора
• Режим отображения — встроенный (карточки для выбора) или отдельный (самостоятельные карточки)
• Обязательный выбор — требовать выбор перед закрытием окна
• Автовыбор первого варианта — первый вариант выбран заранее (только во встроенном режиме)
• Использовать собственный шаблон / Скрыть брендинг Umbrella

Настройки информационного модального окна

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

• Включить информационное модальное окно
• Использовать собственный шаблон / Скрыть брендинг Umbrella

Настройки виджета «Корзина: защищено»

Отображается у товаров в корзине, на которые уже оформлена гарантийная защита.

• Включить карточку защищённого товара в корзине
• Показывать кнопку информационного окна — покупатель может посмотреть сведения о гарантии
• Показывать кнопку удаления защиты — покупатель может удалить гарантийную защиту
• Скрыть позицию расширенной гарантии в корзине — показывать сведения о гарантии только внутри карточки товара
• Скрыть ценовой уровень позиции расширенной гарантии — скрыть ценовой уровень в позиции гарантии
• Скрыть сведения в позиции расширенной гарантии — скрыть подробную информацию о гарантии в позиции
• Добавить к сумме защищённой позиции — объединить цену гарантии с отображаемой суммой товара
• Отключить действия с позицией гарантии — запретить изменение количества в позиции гарантии
• Использовать собственный шаблон / Скрыть брендинг Umbrella

Настройки виджета «Корзина: без защиты»

Отображается у товаров в корзине без гарантийной защиты и предлагает покупателю добавить покрытие.

• Включить карточку незащищённого товара в корзине
• Режим отображения — модальный, встроенный или отдельный
• Только для встроенного режима: Обязательный выбор, Автовыбор первого варианта, Показывать вариант «Без покрытия»
• Показывать кнопку информационного окна
• Использовать собственный шаблон / Скрыть брендинг Umbrella

Настройки виджета статуса заказа

Показывает информацию о гарантийном полисе на страницах подтверждения и статуса заказа.

• Включить виджет статуса заказа
• Скрыть кнопку информации / Скрыть кнопку заявки / Скрыть индикатор статуса / Скрыть срок гарантии / Скрыть сведения о сроке подачи заявки
• Использовать собственный шаблон / Скрыть брендинг Umbrella

Настройки модального окна статуса заказа

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

• Включить модальное окно статуса заказа
• Скрыть ID полиса / Скрыть дату начала / Скрыть дату окончания / Скрыть кнопку просмотра полиса / Скрыть кнопку подачи заявки
• Использовать собственный шаблон / Скрыть брендинг Umbrella

Настройки карточки и модального окна после покупки

Карточка после покупки — допродажа гарантии на страницах статуса заказа для товаров без покрытия. Переключатель: Включить виджет после покупки.

Модальное окно после покупки — модальное окно выбора, которое открывается из карточки допродажи. Переключатель: Включить модальное окно после покупки.

Оба поддерживают параметры Использовать собственный шаблон и Скрыть брендинг Umbrella.

Настройки виджета защиты доставки

Предложение защиты доставки на странице корзины.

• Включить виджет защиты доставки
• Режим отображения — выбор кнопкой (две кнопки: добавить/отказаться) или флажок (один переключатель)
• Параметры выбора кнопкой: Пользовательский HTML кнопки оформления заказа (поддерживает {{{total}}} и {{{price}}}) и Пользовательский текст «Продолжить без защиты»
• Использовать собственный шаблон / Скрыть брендинг Umbrella

Модальное окно защиты доставки — информационное модальное окно с подробностями защиты доставки. Переключатель: Включить модальное окно защиты доставки.

Редактор шаблонов

У каждого виджета есть собственный шаблон HTML и CSS. Откройте его на вкладке Шаблон.

• Редактор HTML — использует синтаксис Handlebars ({{variable}} для экранированного вывода, {{{variable}}} для необработанного HTML). Доступные переменные перечислены на панели инструкций.
• Редактор CSS — стили применяются только к выбранному виджету, чтобы не конфликтовать с вашей темой.
• Панель предпросмотра — отображение в реальном времени на тестовых данных. Переключайте светлый/тёмный режим, количество вариантов, состояние выбора и состояния истечения срока.

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

Вкладка «Языки»

Управляйте строками перевода для каждого виджета, чтобы поддерживать многоязычные магазины. Вы можете просматривать, добавлять и редактировать ключи перевода для каждого поддерживаемого языка.

См. также

• Общие настройки — валюта и ограничения по странам
• Уведомления — оповещения по электронной почте о событиях с гарантиями
• Шаблоны писем — настройка дизайна транзакционных писем