Изменить количество отображения блоков товаров

Если есть потребность изменить количество отображения товара в каталоге, необходимо обновить стили отображения карточек товара. Для этого в файл user.css добавить код, который обновит сетку вывода (после обновления файла, необходимо очищать кеш с помощью комбинации клавиш CTRL+F5).

/ Стандартные мониторы / @media (min-width: 1200px) { / Без боковой панели / .adaptive { width: 20%; } / С боковой панелью / .adaptive-filter { width: 25%; } } / Небольшие экраны ПК / @media (min-width: 992px) { / Без боковой панели / .adaptive { width: 25%; } / С боковой панелью / .adaptive-filter { width: 33.3333333333%; } } /* Маленькие экраны и планшеты */ @media (min-width: 768px) { / Без боковой панели / .adaptive { width: 33.3333333333%; } / С боковой панелью / .adaptive-filter { width: 50%; } } / Телефон и смартфон / @media (max-width: 767px) { / Без боковой панели / .adaptive { width: 50%; } / С боковой панелью / .adaptive-filter { width: 50%; } } Как все это работает? Перед вами представлена базовая сетка, изменив значение для каждого устройства, можно изменить количество отображаемого товара ширине. За базовую сетку берется значение 100%, исходя из этого расчитывается ширина блока.

Например:

Нужно выводить 3 товар в ряд без панели и 2 товара в ряд с панелью. 100/3 = 33.3333333% и 100/2 = 50% - эти значения прописываются для каждого типа экрана и устройства. Причем, если необходимо для ПК выводиться разные значения, эти разные проценты надо расчитать отдельно для каждой сетки.