• Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!
  • Темы озаглавленные с маленькой буквы или капсом удаляются без предупреждения!

Количество колонок в мобильной версии woocommerce

Image CMS
#1
Все перерыл, не нашол. Нужно вывести 2 колонки товара на мобильной версии сайта. Помогите разобраться. Спасибо заранее.
 
#3
Не получается, что только не клацал. Не могу найти. Хэлп. Укажите точнее где эта функция. Заранее огромное спасибо. Повторюсь: В мобильной версии woocommerce выводин один товар (одна колонка), это неудобно приходится листать вниз долго. Как сделать 2 колонки в мобильной версии. На версии для ПК все нормально 3 колонки товара.
 

D&B

Администратор
Команда форума
Местный
#4
Ну скажем так - настраивается если заранее предусмотрено автором. Как правило, в мобильной версии всегда одна колонка с товарами.
 

rikitiki

Специалист
Местный
#5
Woocommerce по умолчанию выстраивает товар в витринах в 4 колонки. При разрешении менее ~600 px, для мобльного отображения, Wocommerce перестраивает товар в 2 колонки.
Отображение товаров в три и одну колонку меняется в темах. Но какая тема используется автор не указал. Возможно Store Front.
 

rikitiki

Специалист
Местный
#9
Все перерыл, не нашол. Нужно вывести 2 колонки товара на мобильной версии сайта. Помогите разобраться. Спасибо заранее.
Такая же проблема уже пол года, удалось найти ответ?
-------------------------------------------------------------------------------------------------------
Для темы Store Front вставьте в Пользовательский CSS Wordpress код:
Код:
@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;
}
}
Пример : http://xarod.tk/shop/
Сузьте по ширине окно браузера до 768 px, чтобы увидеть отображение в две колонки. При дальнейшем сужении менее 320 px товар перестроится на одноколоночное отображение.
 
Последнее редактирование:

Kikin

Новичок
#10
-------------------------------------------------------------------------------------------------------
Для темы Store Front вставьте в Пользовательский CSS Wordpress код:
Код:
@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;
}
}
Пример : http://xarod.tk/shop/
Сузьте по ширине окно браузера до 768 px, чтобы увидеть отображение в две колонки. При дальнейшем сужении менее 320 px товар перестроится на одноколоночное отображение.
Спасибо добрый человек!

Правда кнопки "в корзину" стали такие жирные и размером с товар (смотрятся стремно)
 
Сверху Снизу