Секции

Использование

Секция — визуально обособленный компонент, обычно занимающий всю ширину экрана, внутри которого располагается контент из других компонентов.

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

Имеется возможность стилизовать верхний и нижний край секции. Подробнее тут.

Ширина контента

По умолчанию ширина контента внутри секции ограничена размером контейнера сайта. Ширина контейнера сайта задается в настройках темы.
Параметр Контейнер на всю ширину позволяет снять ограничение ширины контента.

Ширина контента этой секции ограничена контейнером сайта

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Ширина контента этой секции не ограничена

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Минимальная высота секции

Параметр Включить минимальную высоту позволяет принудительно задать высоту секции больше, чем у контента.
Поддерживаются единицы измерения px и vh.
Если хотите сделать секцию по высоте экрана текущего устройства, задайте минимальную высоту 100vh.

Настройки фона

В качестве фона секции можно выбрать:

  • Цветовую заливку
  • Градиентную заливку
  • Изображение
  • Видео с Youtube
  • Видео из Медиатеки

Для того, чтобы текст выглядел более контрастно, активируйте параметр Оверлей (overlay).

Это секция с фоновым изображением

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

Это секция с фоновым изображением и оверлеем

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

Это секция с цветовой заливкой

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

Это секция с зафиксированным фоновым изображением

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

Это секция с градиентной заливкой

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

Это секция с фоновым видео

Поддерживаются форматы WebM и MP4

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

Можно задать кастомные настройки цветов внутри секции для текста, для ссылок и для заголовков.

Прилипающая секция

При включении данного параметра  секция будет прилипать к верхней границе экрана при прокрутке сайта вниз.