Секция “Набор блоков”

Содержание:

Как установить секцию?

Шаг 1. Установим секцию “Набор блоков” на страницу.

1000395
Шаг 2. По умолчанию у нас установлено три блока внутри секции, при желании можно добавить нужное количество блоков, нажав на кнопку “Добавить блок”.

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

1000393
Шаг 3. Добавим на секцию ещё три блока, чтобы получилось шесть блоков, расположенных в три колонки:

1000392
Количество колонок можно задать в “Настройках блоков” во вкладке “Блоки”:

1000391
Шаг 4. Разместим нужную информацию, например, три виджета “Текст” в созданные блоки в шахматном порядке:

1000390
Шаг 5. Получатся блоки с разной высотой.

1000389
Задать одинаковую высоту для всех блоков можно в “Настройках блоков” во вкладке “Отображение”.
В этой вкладке включаем “Одинаковую высоту блоков”:

1000388
Шаг 6. В пустые блоки установим изображения также в шахматном порядке.
Изображение в блок можно установить с помощью виджета “Картинка” или в качестве фона нужного блока.

Первый вариант – установка виджета “Картинка”:

  1. Установим виджет “Картинка” в пустой блок.
  2. Загрузим наше изображение.
  3. Зайдем в настройки виджета и зададим тип картинки “Вписанная” и “Растянуть изображение”.
    Так изображение будет подстраиваться под наш блок и не будет белых зазоров между виджетом “Картинка” и границами блока

1000403
Второй вариант – с установкой изображения в качестве фона блока:

  1. Зайдем в настройки виджета “Блок”, во вкладку “Фон” и выберем фон – “Изображение”;
  2. Загрузим нашу картинку.

1000404
Например, остановимся на втором варианте.
Шаг 7. Добавим изображения в пустые блоки в качестве фона (второй вариант).

1000387
Шаг 8. Добавим виджет “Отступ” в блоки с изображениями и настроим высоту отступов так, чтобы наши пустые блоки с картинками не сжимались на мобильной версии.

1000419
Секция с информацией создана.

Настройки секции

Вкладка “Блоки”

1000385
Количество колонок
Изменяет отображаемое количество колонок на странице в ряд.

1000407
Добавлять в шахматном порядке
При добавлении новых блоков в секцию “Набор блоков” они могут добавляться в шахматном порядке (шаблоном добавления послужат два последних блока).

1000420

Вкладка “Отображение”

1000384
Вертикальное выравнивание

Информацию в блоках можно выровнять по вертикали.
Есть 3 положение выравнивания:

  • Сверху
  • По центру
  • Снизу

1000408
Занимать все пространство секции
Функция “Занимать все пространство секции” позволяет растянуть блоки на всю секцию по ширине и высоте. То есть при активации этой настройки скроются заголовок и подзаголовок – для отображения заголовка и подзаголовка можно создать отдельную секцию.

1000409
Одинаковая высота блоков
Размещая нужную информацию, очень сложно подобрать такое количество слов, чтобы блоки были примерно одинаковыми по высоте. На помощь приходит настройка “Одинаковая высота блоков”.

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

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

1000412

Адаптивность секции “Набор блоков”


У виджета есть настройки адаптивности – отображение содержимого на разных устройствах.
Для настройки адаптивности секции “Набор блоков” необходимо включить адаптивность страницы на нужных устройствах:

1000383
После этого в настройках секции появятся вкладки с настройками адаптивности:

1000382
В настройках адаптивности секции “Набор блоков” мы можем:

  • Изменять количество колонок для выбранного устройства
  • Изменять горизонтальные отступы.

Сделаем разное отображение колонок для разных устройств. Для планшета настроим показ двух колонок, на широкоэкранном виде оставим три колонки, на мобильном – только одну:

1000421

Была ли эта статья полезна?

Похожие статьи