На странице моего магазина Woocommerce есть 4 товара в строке, и это значение меняется на 2 товара в строке с разрешением 768 пикселей. При примерно 1200px 4 столбца становятся слишком тонкими, и они продолжают становиться более тонкими, пока экран не достигнет 768px.
Мне нужно поменять продукты в строке на 3 при 1200px. Я могу в некоторой степени добиться этого, используя CSS, но он очень хакерский, а затем на 768px он ломает хороший переключатель на 2, который у нас есть здесь.
/**
* Change number or products per row to 3
*/
add_filter('loop_shop_columns', 'loop_columns', 999);
if (!function_exists('loop_columns')) {
function loop_columns() {
return 3; // 3 products per row
}
}
Используя приведенный выше код (в функциях. php) I можно изменить число выводов в ряду на 3 и сохранить работоспособность переключателя на 2, но все, что больше 1200 пикселей, выглядит плохо.
Есть ли способ использовать приведенный выше код, но только после того, как размер экрана будет на 1200px, при хранении 4 продукта в строке для чего-то большего?