Баннеры
В системе Zeta Web встречаются два вида баннеров:
Статические баннеры;
Динамические баннеры, созданные с помощью контрола.
Статические баннеры
Статические баннеры добавлены на страницу как код html, не управляются контролом и редактируются силами пользователя.
Структура блока баннера:
Строка баннеров .banners__row должна быть вложена в контейнер .banners__container.
В одну строку может поместиться 4 баннера наименьшего размера.
Классы управления размерами баннера:
Класс
Максимальная ширина
.banners__item_w1
max-width: 215px;
.banners__item_w2
max-width: 430px;
.banners__item_w3
max-width: 646px;
.banners__item_w4
max-width: 861px;
Класс
Максимальная высота
.banners__item_h1
max-height: 215px;
.banners__item_h2
max-height: 430px;
.banners__item_h3
max-height: 646px;
.banners__item_h4
max-height: 861px;
Необходимо использовать оба размера баннера: и ширину, и высоту.
Если баннер квадратный, используйте следующие классы:
Класс
Максимальная ширина
Максимальная высота
.banners__item_x1
max-width: 215px;
max-height: 215px;
.banners__item_x2
max-width: 430px;
max-height: 430px;
.banners__item_x3
max-width: 646px;
max-height: 646px;
.banners__item_x4
max-width: 861px;
max-height: 861px;
Если баннер по высоте занимает более одной строки, используйте дополнительный класс для задания высоты баннера с учетом отступа между строк баннеров.
Класс
Максимальная высота
.banners__item_r2
max-height: 445px;
.banners__item_r3
max-height: 661px;
.banners__item_r4
max-height: 876px;
Баннеру можно задать заголовок. Для использования заголовка в форме эллипса используйте классы: .banners__link-ellipse и .banners__link-ellipse_top, или .banners__link-ellipse_bottom.
Для использования заголовка в виде полосы используйте классы .banners__link-rectangle и .banners__link-rectangle_bottom, или .banners__link-rectangle_top.
Для добавления границы для баннера используйте класс .banners__inner_border вместе с .banners__inner.
Изображения для баннеров добавляются средствами 1С. В форме выбора изображения укажите класс css .banners__img, а также размеры самого изображения, согласно выбранным классам ширины и высоты.
Статические баннеры в типовом дизайне
Для верстки баннеров типового дизайна используется: дополнительный контейнер .banner-group для группировки баннеров в колонки с шириной 50%. Используйте собственные классы для построения необходимой сетки.
В 1С баннеры размещены в переменных banner-1 - banner-7 и собраны в переменную banner. Переменная banners размещена на главной странице.
Динамические баннеры
Для создания или изменения динамического баннера необходимо перейти в раздел "Баннеры".
Zeta Web 2.x
Zeta Web → Панель управления сайтом → вкладка Информационные блоки →вкладка Баннеры.
Zeta Web 3.x
Zeta Web → Панель управления "Контент" → вкладка Информационные блоки и баннеры.
В таблице по каждому баннеру приведен его код в системе, наименование, URL (веб-адрес страницы, на которую попадет пользователь при клике на баннер), даты начала и окончания размещения баннера на сайте, формат баннера и список страниц, на которых он отображается.
Параметры динамических баннеров
При создании нового баннера, задайте четыре группы параметров: - основные настройки, - настройки показа, - назначение, - картинку.
В поле Наименование укажите название баннера, которое будет отображаться в справочнике 1С.
В поле Комментарий (title) введите текст, который будет показан на сайте при наведении указателя мыши на баннер.
В поле Число показов задайте максимальное количество показов баннера на сайте, за весь период показа.
Задайте период показа в полях Дата начала показа и Дата окончания показа. Для указания даты нажмите на кнопку в правом углу поля и выберите нужное число в календаре.
В поле Вес присвойте баннеру его очередность появления на странице сайта. Если на одном рекламном месте отображается несколько баннеров по очереди, то первым будет отображаться баннер с наименьшим весом. Следовательно, чем больше абсолютное значение числа, указанного в поле Вес, тем дальше в очереди отображения на сайте будет помещен баннер. Например, если первому баннеру присвоен вес 200 единиц, а второму - 100, то на сайте будет сначала показан второй баннер, затем первый.
В поле Формат баннера откройте справочник форматов с помощью кнопки с тремя точками и выберите подходящий вариант. Информация о формате баннера задается для размещения его в правильном контроле на странице. Справочник форматов можно просмотреть, отредактировать и дополнить на вкладке Форматы.
В поле Группа страниц баннера выберите из справочника группу, содержащую список тех страниц, на которых будет отображаться баннер.
В поле URL с помощью кнопки с буквой "T" выберите тип ссылки, которая будет содержаться в баннере.
Далее нажатием на кнопку с тремя точками выберите страницу, на которую будет вести клик по этому баннеру.
В поле Картинка в правой части окна параметров баннера задайте картинку, которая будет отображаться на сайте. Для этого нажмите на кнопку с тремя точками и выберите нужную картинку из справочника Картинок.
Нажмите кнопку ОК, чтобы сохранить сделанные изменения и вернуться к списку баннеров, размещенных на сайте.
После создания динамического баннера размещаем его в переменной, области или на странице.
Пример добавления динамического баннера на примере типового дизайна
За отображение динамических баннеров отвечает переменная aside-banners во вкладке Наполнение сайта.
Эту переменную необходимо разместить через кнопку "Редактировать наполнение" в области, на которой должен отображаться этот баннер.
Далее - выполнить обмен с сайтом.
По данной инструкции динамический баннер отображается на сайте в левой области под меню.
Если на страницу добавляется более одного баннера, на этапе добавления в переменную, необходимо настроить "время обновления" баннера - время, с какой периодичностью будут меняться баннеры.
Для этого (на примере типового дизайна) нужно открыть переменную aside-banners, выделить контрол, через нажатие на кнопку с зеленым карандашом перейти в настройки котрола.
В настройках контрола - указать желаемое время в секундах.
Форматы баннеров
Раздел Форматы позволяет просмотреть и отредактировать справочник размеров баннеров, размещенных на сайте.
Zeta Web 2.x
Zeta Web → Панель управления сайтом → вкладка Информационные блоки →вкладка Баннеры→ вкладка Форматы.
Zeta Web 3.x
Zeta Web → Панель управления "Контент" → вкладка Информационные блоки и баннеры
Создайте новый формат с помощью строки контекстного меню Добавить или отредактируйте существующий формат, нажав дважды левой кнопкой мыши на наименование формата в списке. Далее заполните/измените данные в карточке формата баннера.
В поле Наименование введите любое название, по которому, впоследствии, сможете найти нужный формат баннера в списке.
В полях Ширина и Высота введите размеры баннера в пикселях.
Нажмите кнопку "ОК", чтобы сохранить все сделанные изменения и вернуться к справочнику форматов баннеров.
Статистика просмотров и кликов
Zeta Web 2.x
Закладка Просмотры и клики позволяет просматривать статистику показов динамических баннеров, уже размещенных на сайте, и количество кликов по ним.
Zeta Web 3.x
Пройдите в раздел Просмотры баннеров по ссылке меню Zeta Web → Панель управления "Контент" → вкладка Информационные блоки и баннеры
Last updated
