• Доброго дня,

    Есть ли плагин меняющий отображаемое количество колонок товара в зависимости от разрешения экрана?
    Сайт на WordPress + WooCommerce + тема Storefront
    На дэсктопах отображается 4 столбца с товарами. На высоких разрешениях — этого маловато будет. Сейчас и мобилы/планшеты зачастую имею большие экраны и разрешения.
    Есть ли плагин подстраивающий отображаемое количество столбцов товара в зависимости от разрешения (или PPI на мобилах)? Или это решается правкой CSS… что-то типа:

    @media screen and (min-width: 768px; max-width 1079) 
    /* какой-то код для отображения скажем 4х колонок */
    @media screen and (min-width: 1080px) 
    /* какой-то код для отображения скажем 5-6 колонок */
Просмотр 7 ответов — с 1 по 7 (всего 7)
  • За отображение сайта отвечает тема. Подберите тему, где это настраивается.
    Сторефронт, кстати, позволяет установить до 6 столбцов.

    Сторефронт, кстати, позволяет установить до 6 столбцов.

    Да, но насколько я понял — статически. Т.е. какое бы ни было разрешение экрана (хоть самое маленькое) — будет отображаться 6 столбцов

    Вы не правильно поняли

    Если можно отображать до 6 столбцов динамически — то это же здорово! Подскажите плииз где это настраивается? 🙂

    Где обычно настраиваются темы: Внешний вид — Настройка — Woocommerce

    Всем привет! Облазил все форумы, в т.ч. и этот. Не нашел, помогите с вопросом. Нужно что бы на мобильной версии сайта отображались товары хотя бы по 2 в ряду, тема Storefront в разделе настройки — установлено отображение по 4 шт в ряд, однако если на ПК это работает, то на телефоне — нет (телефон samsung galaxy s9 plus), на телефоне товар в ряд 1 и идут друг под другом.
    Есть ли какое то решение? Может плагин или код, если код то где и что вставить?

    Где обычно настраиваются темы: Внешний вид — Настройка — Woocommerce

    Эмм… в разделе Woocommerce настроек внешнего вида Storefront нет ничего такого. Можно Вас попросить показать скриншот?

    Нужно что бы на мобильной версии сайта отображались товары хотя бы по 2 в ряду

    Для связки Woocommerce + Storefront попробуйте добавить следующие CSS правила

    @media (min-width: 320px) and (max-width: 768px) {
    ul.products li.product {
    width: 48%;
    float: left;
    clear: both;
    }
    
    ul.products li.product:nth-child(2n) {
    clear: none;
    float: right;
    }
    }
    • Ответ изменён 4 года, 8 месяцев назад пользователем maomarketplace.
Просмотр 7 ответов — с 1 по 7 (всего 7)
  • Тема «Кол-во ед. товара в зависимости от экрана» закрыта для новых ответов.