Vendors page products too small in mobile layout

[samin.khanaki]

Hello I already shared this problem with you. Unfortunately when I tried to send another reply to your request for url website made an error which says you must be loged in to send posts and there was no way to solve this problem. any way here is the post i sent you before:
#111710
I used wcfm for my website, everything is perfect except product tiles in vendors page in mobile version. When customers go directly to woocommerce product page in their mobiles it shows 2 product in each row so they can see products very well. but when they go inside of a vendors page to check its products it shows 5 products in each row, just same as desktop layout which make them very small in mobile layout. how can i change number of products per row in vendors page mobile layout?

Here is a sample vendor page URL: https://www.monjooq.com/store/roxie-gallery/
I also attached a photos from my shop page which is my ideal format of showing product tiles. and in the URL you can see product tiles format that is too small.

Thanks in advance

Attachments:

You must be logged in to view attached files.

[Sayan Naskar]

Hello,
Use the following code in the custom css section of your theme.

@media (max-width: 544px) {
#wcfmmp-store .product_area .products-wrapper ul.products li.product:nth-child(2n) {
margin-left: 0;
clear: left;
}
#wcfmmp-store .product_area .products-wrapper ul li.product {
width: calc(50% – 10px);
display: inline-block;
}
#wcfmmp-store .product_area .products-wrapper ul.products li.product:nth-child(2n+1) {
clear: right;
}
}

[samin.khanaki]

unfortunately didnt work. nothing changed at all.

Attachments:

You must be logged in to view attached files.

[Sayan Naskar]

The styles you have written are not loading up on your site. Can you write the style in the customizer custom CSS section? and also try to clear the cache?

[Author]

Posts