Return to previous page

How to set products number per row differently between Dexktop, Tablet, Mobile ?

This topic has 8 replies, 3 voices, and was last updated 1 week, 4 days ago ago by Tony Rodriguez

Brunos

Participant

January 16, 2026 at 08:33

Hello,
I’m very confused. I don’t understand how to set the number of products per row in the shop. I would like only one product per row for the mobile version.
I entered 1 in the configuration (see image), but I still have two products.

Regards

Content is visible for topic creator and
support staff only.

Files is visible for topic creator and
support staff only.

#464307 Copied

7 Answers
Samir Malik

Support staff

January 16, 2026 at 08:39
Hello,

Please try adding this custom CSS under XStore > Theme Options > Theme Custom CSS > Global CSS:

@media only screen and (max-width: 480px) { body .products-grid .product { width: 100%; } }

Kind regards,
The 8Theme Team
#464308 Copied
Brunos

Participant

January 16, 2026 at 08:58

This code does not work.
However, why does it not work in the Xstore configuration despite my settings being set to 1?

#464310 Copied

Brunos

Participant

January 16, 2026 at 09:25

Forget the last message, it’s working now (maybe a cache issue…).
However, I’d like to understand: how do I set the number of products per row according to the interface (mobile, desktop, tablet)?

#464314 Copied

Samir Malik

Support staff

January 16, 2026 at 10:25

Hello,

There are no settings that need to be changed on each device.

Currently, the configuration is set for desktop, and there are some default CSS styles that control the columns on tablet devices.

Could you please let us know how many products per row you would like to display on tablets? We can then provide you with the appropriate custom CSS code.

Best regards,
8Theme Team

#464316 Copied

Brunos

Participant

January 16, 2026 at 10:39

I wanted to know if there was a simple way to make future changes via the dashboard. And because I like to understand things.
The current configuration with your new CSS code suits me for now.

Regards

#464317 Copied

Brunos

Participant

January 16, 2026 at 14:10

Thanks for the support! My topic “How to set products number per row differently between Dexktop, Tablet, Mobile ?” has been successfully resolved.

#464334 Copied

Tony Rodriguez

Support staff

January 16, 2026 at 14:10

Dear Brunos,

It’s great having you in our WordPress & WooCommerce community!

Every insight you share helps us refine XStore and build tools that empower thousands of online store owners worldwide.

Leave Feedback →
(takes less than a minute)

Together, we grow stronger with every release.

Topic closed.
The 8Theme Team

#464335 Copied
Viewing 8 results - 1 through 8 (of 8 total)

The issue related to '‘How to set products number per row differently between Dexktop, Tablet, Mobile ?’' has been successfully resolved, and the topic is now closed for further responses

How to set products number per row differently between Dexktop, Tablet, Mobile ?

Explore our best WordPress WooCommerce Themes collection