Как настроить сетку товаров в Tilda
Количество колонок, ширина карточек и расстояния для разных размеров экрана.Подробнее о модеСвернуть описание
Как настроить сетку товаров в Tilda
Количество колонок, ширина карточек и расстояния для разных размеров экрана.Что умеет мод
- Задаёт число карточек в ряд на собственных брейкпоинтах.
- Предлагает гибкую сетку с боковыми отступами и фиксированную с максимальной шириной.
- Настраивает вертикальные и горизонтальные промежутки и высоту фото.
- Позволяет отдельно включить изменение размеров текста карточки.
Как подключить
Выберите блок магазина
Укажите область в «Где применять» и выберите свой блок из каталога конструктора. Для классического магазина и нового каталога T1291/T1301 используются разные классы, которые подставляются автоматически.
Настройте брейкпоинты
Для каждой ширины задайте число колонок, промежутки и высоту фото. Добавьте нужные разрешения и выберите гибкую или фиксированную сетку.
Проверьте типографику
Оставьте оформление текста из Tilda или включите его переопределение для выбранного брейкпоинта. Проверьте длинные названия, описания и обе цены.
Установите и проверьте
Вставьте код в T123 после магазина и опубликуйте страницу. Изменяйте ширину окна, проверьте фильтрацию и подгрузку товаров, затем откройте каталог на телефоне.
Что учитывать. Переключатель разрешения в превью меняет только демонстрацию. В копируемый код входят настройки всех заданных брейкпоинтов. Правильный выбор блока нужен, чтобы мод применял подходящие классы сетки.
Вопросы и ограничения
Можно сделать больше карточек на широком экране?
Да. Задайте число колонок для нужного брейкпоинта и проверьте, хватает ли ширины для названий, цен и кнопок.
Чем отличаются гибкая и фиксированная сетка?
Гибкая занимает доступную ширину с заданными боковыми отступами. У фиксированной можно ограничить максимальную ширину.
Обязательно менять шрифты карточек?
Нет. Переопределение типографики включается отдельно. Без него сохраняйте настройки текста своего магазина.
Нужен отдельный код для телефона?
Нет. Настройте мобильные брейкпоинты в том же конструкторе и установите один общий код.
Доступ к конструктору
Это бесплатная модификация. Войдите в аккаунт, чтобы настроить её и получить код.
