Виджет «Рекламный баннер»

Виджет «Рекламный баннер» представляет собой одно баннер, на который можно добавить свой текст и кнопку.

Виджет «Рекламный баннер»

Общий вид

Особенности:

— Баннер по ширине имеет четкое ограничение размеров в зависимости от типа устройства;

— По краям слайдера будут белые полосы.

Особенности:

— Баннер растягивается на всю ширину окна браузера;

— В зависимости от ширины окна браузера (больше чем 1 920 px), баннер может обрезаться по горизонтали.

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

Как создать?

Чтобы создать виджет «Рекламный баннер», в админ-панели сайта войдите в раздел «Контент → Виджеты», нажмите на кнопку «Добавить» в правом верхнем углу. В открывшемся окне найдите виджет «Рекламный баннер» и нажмите «Создать».

Параметры

Общие

Перед вами откроется форма с возможностью выбрать параметры виджета.

Заполните поля и выберите параметры:

  • Название виджета
    Внутреннее название для админ-панели. Нигде не отображается.

  • Тип устройства

    • Универсальный — виджет будет отображаться на всех устройствах;

    • Для десктопа — отображение будет только на компьютере/ноутбуке;

    • Для мобильных устройств — отображение только на мобильных устройствах.

  • Ширина

    • По ширине контента — изображение будет ограничено шириной контента, ширина контента своя для каждого устройства, подробнее здесь;

    • На всю ширину — ограничение по ширине будет исходить лишь от ширины окна браузера.

  • Тип отображения
    Вариант выравнивания надписи:

    • Надпись по центру — выравнивание по центру;

    • Надпись слева — выравнивание по левому краю.

  • Заголовок
    Добавьте заголовок типа H2.

  • Цвет заголовка
    С помощью цветовой палитры выберите цвет заголовка.

  • Описание
    Добавьте описание типа основной наборный текст (толщина 2)

  • Цвет описания
    С помощью цветовой палитры выберите цвет описания.

  • Текст ссылки
    Текст кнопки на баннере.

  • Url ссылки
    Url страницы, на которую будет переадресовывать при клике на кнопку.

  • Фоновое изображение
    Загрузите изображение баннера.

Не забудьте активировать виджет после создания. Это можно сделать в разделе «Контент → Виджеты», путем переключения бегунка в состояние Вкл.

Требования к изображениям

Требования к изображениям зависят от параметра виджета «Ширина», а также от устройства.

Сайт определяет 4 основных типа устройства:

  • Desktop (настольные ПК) — от 1 460 px и выше;

  • Laptop (ноутбуки) — от 1 044 px до 1 460 px;

  • Tablet (планшеты) — от 768 px до 1 044 px;

  • Mobile (мобильные телефоны) — до 768 px.

Допустимые форматы: .jpeg и .png.

Устройство и соответствующий размер изображения:

Для десктопа (ноутбуки и настольные ПК) — 1 320 x 320 px;

Для мобильных устройств (мобильные телефоны и планшеты) — 375 x 320 px.

Допустимые форматы: .jpeg и .png.

Устройство и соответствующий размер изображения:

Для десктопа (ноутбуки и настольные ПК) — 1 920 x 320 px;

Для мобильных устройств (мобильные телефоны и планшеты) — 375 x 320 px.

Порядок установки (2 вар.)

1 вариант — Через вставку кода

После сохранения всех параметров, скопируйте «Код для установки на сайт».

Перейдите на нужную страницу или продукт, в режиме исходного кода вставьте код виджета в то место, которое необходимо.
Готово!

(Дважды кликните по изображению, чтобы запустить GIF)

2 вариант — Через редактор страниц

Перейдите в раздел "Контент → Наполнение сайта → Страницы" нажмите на название страницы. Вы окажитесь в редакторе страниц.
Слева выберите необходимый виджет и вставьте в поле правее в нужном порядке.
Готово!

(Дважды кликните по изображению, чтобы запустить GIF)