Группа представляет собой контейнер, который содержит другие блоки и располагает их. Используйте ее, чтобы ставить элементы рядом, создавать столбцы или задавать части секции собственный фон и границу.
Где можно использовать группы
Блок "Группа" принимают многие секции: подвал, рассылка, главный баннер, слайды слайд-шоу, FAQ, до и после, отзывы, контакты, 404, подтверждение заказа, раскрывающиеся строки и текстовая область списков товаров, например рекомендуемых товаров и коллекций. Каждая секция сама решает, какие блоки можно помещать в ее группы и сколько групп она принимает.
Чтобы добавить группу в конструкторе, выберите секцию, нажмите Добавить новый блок и выберите Группа. Затем перетащите в нее другие блоки. Некоторые секции (подвал, рассылка, отзывы) позволяют также вкладывать группу в группу.
Макет
- Ширина: Заполнить занимает свободное место и делит его поровну с соседними группами "Заполнить". Вписать занимает ровно столько, сколько нужно содержимому. Настраиваемый задает Пользовательская ширина в процентах.
- Направление: Вертикальный ставит блоки друг под другом, Горизонтальный ставит их рядом. Блоки, стоящие рядом, переносятся на новую строку, если не хватает места.
- Расположить вертикально на мобильном (только для горизонтального): на телефонах блоки располагаются друг под другом.
- Позиция: размещает блоки по вертикали (Вверху, По центру, Внизу).
- Выравнивание: размещает блоки по горизонтали (Слева, По центру, Справа).
- Пространство между: распределяет блоки с равными промежутками между ними. Этот вариант доступен в том направлении, в котором идут блоки: в позиции для вертикальной группы и в выравнивании для горизонтальной.
Внешний вид
- Использовать цветовую схему родителя: включено по умолчанию, поэтому группа использует цвета секции. Выключите и выберите Цветовая схема, чтобы задать группе собственные цвета фона и текста.
- Граница: Нет или Сплошной. При варианте "Сплошной" появляются Толщина границы (от 1 до 20 пикселей) и Прозрачность границы. Цвет берется из цвета границы схемы.
- Радиус скругления: скругляет углы, от 0 до 100 пикселей.
- Наложение фона: добавляет цветной слой поверх фона. Задайте Цвет наложения и Стиль наложения: Сплошной или Градиент, который плавно становится прозрачным, с Направление градиентаВверх или Вниз. Полезно, чтобы текст хорошо читался поверх изображения главного баннера.
Отступы
Промежуток означает расстояние между блоками внутри группы (от 0 до 100 пикселей). Отступы означают расстояние между краем группы и ее блоками с каждой стороны.
Рецепты
- Две кнопки рядом в главном баннере: поместите обе в горизонтальную группу с небольшим промежутком.
- Три столбца в подвале: горизонтальная группа с тремя элементами "Заполнить" внутри и включенным "Расположить вертикально на мобильном".
- Карточка: вертикальная группа со своей цветовой схемой, сплошной границей, скруглением и отступами.
- Текст слева, кнопка справа: горизонтальная группа с выравниванием "Пространство между".
Полезно знать
- Один столбец шире, чем нужно: две группы "Заполнить" делят место поровну. Установите для одной вариант "Настраиваемый" и задайте процент.
- Группа не показывается: группа без блоков или только со скрытыми блоками в магазине не показывается.
- Группы нет в списке блоков: эта секция не принимает группы или достигнут ее лимит групп.
- Настройки текста, кнопки и разделителя описаны в статье Блоки "Группа", "Текст", "Кнопка" и "Разделитель": как работают настройки элементов макета?.