Отображение похожих товаров

[YaSerg]

WooCommerce на страничке товаров внизу выводя сопутствующую продукцию (Вам также может понравиться…) первый товар всегда выводит ориентированным по левому краю, а второй начинает с новой строки. Далее все товары идут ровно сеткой.
Такая же ситуация и когда выводить в записи блога товары из категории или всю категорию.

Как можно сделать что бы первый элемент был так же обтекаем как и последующие?

P.S. На различных темах ситуация одинаковая. На данный момент стоит вутик.

 

[Валерий]

первый товар всегда выводит ориентированным по левому краю, а второй начинает с новой строки. Далее все товары идут ровно сеткой. На различных темах ситуация одинаковая.

Не замечал, тем более на различных темах подобной "одинаковой" ситуации. Товары обычно идут ровной сеткой в виде строки. Ну, конечно, зависит еще от того, сколько товаров у Вас выводится в данном блоке. Если много - то несколько строк-сеток.

У Вас может возникнуть описанная выше ситуация, если блоки похожих товаров обтекается по правому краю, сам блок выровнен по левому, и при этом сумма ширин блоков похожих товаров в строке > ширины блока основного контента. Т.е. если ширина основного контента, например, 700px, а товарных блоков 200px, и блоков должно выводится 4 (4 похожих товара), то первый блок будет один на строке, выровненный по левому краю, а остальные 3 - с новой строки по правому краю. Нужно или количество товаров уменьшить (сделать 3, а не 4 товара), или ширину блоков уменьшить, чтобы они помещались.

 

[ya.zkp]

напишите какая у вас тема а лучше приложите скриншот

 

[YaSerg]

Тема Wootique

По совету Валерия попробовал сделать эксперементы изменяя ширину блоков и отступы. Что привело к ещё более запутанной ситуации.

На данный момент у меня настроен вывод товаров в два столбца и ширина регламетируется кодом:

/* 4 columns */
#footer-widgets.col-4 .block { width:22.2%; float: left; margin-right:3.7%; }
#footer-widgets.col-4 .footer-widget-4 { margin-right:0; }

/* 3 columns */
#footer-widgets.col-3 .block { width:30.75%; float: left; margin-right:3.8%; }
#footer-widgets.col-3 .footer-widget-3 { margin-right:0; }

/* 2 columns */
#footer-widgets.col-2 .block { width:48%; float: left; margin-right:3.8%; }
#footer-widgets.col-2 .footer-widget-2 { margin-right:0; }

/* 1 column */
#footer-widgets.col-1 .block { width:100%; }

Это видно и на скриншотах. Измеив немного (к примеру до 45% ширину блоков) первые два блока выстраиваются и умещаются в ряд, а вто вторая строка блоков наоборот приобретает перенос строки, который отсутствовал до изменений. Получается уменьшив блок решаешь проблему первой строки, но получаешь проблему со второй строкой.

Обратите внимание на первом скриншоте ширина по умолчанию, на втором уменьшена до 45%.

 

[delitant]

Может есть смысл поэкспериментировать с размерами миниатюр товаров?

 

[YaSerg]

Может есть смысл поэкспериментировать с размерами миниатюр товаров?

Уже попробовал. Очень странно что на любой теме этот косяк повторяется через строку в зависимости от размеров блока.
Попробовал создать отдельную страницу без сайдбара, места валом. Вставляю [product_category category="appliances"] первая строка с переносом, вторая нет, третья с переносом, четвёртая нет и так далее.

 

[delitant]

Очень странно что на любой теме этот косяк повторяется через строку в зависимости от размеров блока.

Вот это странно, я с такой проблемой ни разу ни на одной теме не сталкивался. Может у вас что-то с файлами плагина WooCommerce?

 

[YaSerg]

Вот это странно, я с такой проблемой ни разу ни на одной теме не сталкивался. Может у вас что-то с файлами плагина WooCommerce?

Они не редактировались, ума пока не хватает.

Если, возможно, кто захочет взглянуть на ситуацию могу скинуть линк на сайт в ЛС.