Главный баннер




На главной странице сайта можно разместить несколько баннеров в слайдере.


Баннер "html-5"

По умолчанию установлен динамический баннер с HTML5 версткой. Он включает в себя динамические свойства: ссылка (на весь баннер), фоновое изображение/видео, заголовок, описание, кнопки. В этом типе баннеров фоновой изображение/видео обрезается с уменьшением экрана. 

Почему края у динамического главного баннера обрезаются?

Потому что могут быть только два варианта:

  1. баннер уменьшается пропорционально
  2. баннер обрезается по сторонам

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


Почему не стоит всю информацию размещать на фоновой картинке?

Потому что нельзя адаптировать информацию на баннере в виде картинки. Можно только пропорционально уменьшать.




Как разместить баннер "Год семьи 2024"?

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

Пример НЕПРАВИЛЬНОГО отображения:


Пример ПРАВИЛЬНОГО отображения:


Если при размещении баннера "Год семьи -2024" изображение отображается не полностью и в баннерах используются только картинки (без описания и кнопок) можно изменить тип баннеров на "Изображение".




Как изменить тип баннера на "Изображение"?

Если html-5 баннер не подходит и необходимо размещать всю информацию на изображении, можно изменить тип баннера в настройках сайта. В этом случае заполнять нужно будет только поля "Заголовок", "Фоновое изображение" и "Ссылка" на вкладке "Главный баннер". Ссылка будет поставлена на весь баннер, кнопки не предусмотрены.

Шаг 1. Перейти в настройки сайта.

Шаг 2. Перейти на вкладку "Главный баннер". 

Шаг 3. Изменить тип баннера на "Изображение".

Шаг 4. Сохранить изменения.

Добавление/редактирование главного баннера

Шаг 1. На панели управления включить публичный редактор данных:


Шаг 2. Навести курсор мыши на блок и выбрать нужное действие (добавить, редактировать, удалить).


При выборе удаления появится окно с уточняющим сообщением об удалении


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

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

Что делать, если не работают кнопки редактирования главного баннера?

Если при нажатии на кнопки редактирования не открывается форма редактирования, а к адресу вашего сайта подставляется решетка #, например:

то отредактировать баннер можно через административный раздел:

Шаг 1. Нажать на шестерёнку на панели администрирования.

Шаг 2. Перейти в подраздел "Элементы". 

Шаг 3. В выпадающем списке выбрать тип данных "Главный баннер".

Шаг 4. В списке элементов можно отредактировать или удалить баннер.

Форма редактирования

Вкладка Главный баннер

Активность - если баннер активен, то оно отобразится на сайте для всех пользователей.

Заголовок - название баннера, не отображается на баннере. Для добавления текстового заголовка на баннере, его нужно прописать в другое поле "Заголовок" на вкладке "Описание".

Сортировка - порядковый номер баннера. Чем выше число, тем раньше в слайдере будет отображаться.


Фон баннера может быть трех видов:

- цвет
- изображение
- видео


Рекомендуемый размер - 1920*500px.


Ссылка - можно прописать ссылку на весь баннер. Т.е. при нажатии на любое место на баннере, будет осуществлен переход по этой ссылке.

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



Вкладка Маска

На фон баннера можно наложить цвет и узор с установленной прозрачностью. 

Вкладка Кнопки

Кнопки - кнопок можно добавить несколько. В первом поле (рядом с http://) указывается ссылка, в поле под ссылкой прописывается название кнопки.

Можно настроить внешний вид кнопок из предусмотренных вариантов типа и стиля кнопок.


Вкладка Анимация






Вкладка Модификаторы

Что такое модификаторы и как ими пользоваться?








Вкладка Описание

Цветовая схема - текст на баннере будет отображаться белым или черным в зависимости от выбранной темы. Если нужно использовать собственные цвета, цветовую схему выбирать не нужно, в поле оставить "Нет значения".

Текст описания - отобразится текст на баннере.

Цвет описания - можно выбрать собственный цвет текста описания.



Заголовок - заголовок баннера отобразится на баннере над описанием.

Цвет заголовка - можно выбрать собственный цвет текста заголовка.


На баннере можно разместить небольшую картинку (иллюстрацию).

Порядок отображения - порядок отображения заполненного описания и изображения (иллюстрации).

при выборе порядка "Изображение - Описание" необходимо прописать модификатор изображения с правым отступом, например, mr-3:


Иллюстрация - загружается изображение.

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



Положение иллюстрации - положение изображения иллюстрации по вертикали.