Return to previous page

Diferent columns in products secction I need 1 column on mobile

This topic has 4 replies, 2 voices, and was last updated 1 years ago ago by Tony Rodriguez

Streamsim

Participant

April 5, 2023 at 19:09

Is it possible to set one column of products, and not two, as in prntsc for the mobile version, while for the tablet, 2 columns, and for the desktop version, 4 columns?
Prntscr –

#352451 Copied Theme version: 9.1 WooCommerce version: 7.5.1

3 Answers

Tony Rodriguez

Support staff

April 6, 2023 at 07:58

Hello Streamsim,

Thank you for purchasing our theme and for reaching out to our support center.

In order to better understand your issue, we kindly request that you provide us with a screenshot of the issue. You can upload the screenshot to https://postimages.org/ and paste the link here.

Additionally, please provide us with your WordPress admin login details in the private content area using the following format:

WP Admin URL:
WP Admin Username:
WP Admin Password:

We strongly recommend that you take a complete backup of your site before proceeding.

We look forward to assisting you.

Kind regards,
8theme Team

#352475 Copied

Streamsim

Participant

April 6, 2023 at 08:13

I already wrote about it. I don’t know where to set the store and category view to have 1 column and not 2 as it is now, because the content does not fit in a nice way.
If you change something on the website, I need to know what has been changed because I am versioning the changes.
https://postimg.cc/5jDdJbS1

Please contact administrator
for this information.

#352477 Copied
Tony Rodriguez

Support staff

April 6, 2023 at 10:08
Hello Streamsim,

Thank you for purchasing our theme and for contacting our support center.

1) To display one product per row on mobile devices, please copy and paste the following CSS code into XStore >> Theme Options >> Theme Custom CSS >> Global CSS and then clear your browser cache to view the changes:
```
@media only screen and (max-width: 500px){
.products-grid .product {
width: 100% !important;
}
}
```
2) To display two product per row on tablets version, please copy and paste the following CSS code into XStore >> Theme Options >> Theme Custom CSS >> Global CSS and then clear your browser cache to view the changes:
```
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.products-grid .product{
width: 50% !important;
}
}
```
3) To display two products per row on shop, category, and brand pages for desktops version, please navigate to XStore > Theme Options > Woocommerce (Shop) > Shop > Shop Page Layout. There, you can choose the 4-column grid. Please refer to the image provided here: https://postimg.cc/kBgPsdgR

We appreciate your business and thank you for your patience.

Best Regards,
8Theme’s Team
#352507 Copied
Tagged: columns, mobile, products, templates, woocommerce, wordpress
Viewing 4 results - 1 through 4 (of 4 total)

The issue related to '‘Diferent columns in products secction I need 1 column on mobile’' has been successfully resolved, and the topic is now closed for further responses

Diferent columns in products secction I need 1 column on mobile

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection