Two columns for products and 1 for categories

Hello
i am trying to set up for mobile, two columns for products and 1 for categories how can i do that?
Your “Products columns on mobile” theme setting seems to change them both. Maybe there is another setting?
There is no how can I do it?
Thank you

Hello,

You need to create a row with two columns and insert the Product category element in one column and Product Grid in the other. https://xtemos.com/docs/woodmart/shortcodes-2/ and https://xtemos.com/docs/woodmart/faq-guides/product-grid-carousel-element/

Here is a video on how to configure the template: https://wpbakery.com/video-academy/add-row-column-wpbakery-page-builder-wordpress/

Best Regards

Hello,
the columns of the categories I am talking about are those of the shop page that is created automatically. It is not built with WpBakery.
In any case, I need to change the display of columns in Mobile, in the theme settings, the columns setting seems to manage products and columns, it is not distinct.
In mobile, I would like one column for categories and two columns for products.

Thank you

Hello,

Please navigate to Appearance > Customize > Woocommerce > Product catalog, you will find the option to show both categories and products, however, there is no option or possibility to put categories on one since and products on another side.

Best Regards

Hello,
perhaps my question is not clear to you.
Have you seen the video?
In the video you see a Mobile screen, two category columns, then you see product list and you see two products columns.

I try to explain you better.

In mobile.
The shop page that contains the categories will need to be on one column.
Instead the product list in general should be in two columns.

The indications you have given do not differentiate mobile, they give only one setting for desktop products.

There is a setting in your theme:
Shop> Products grid> Products columns on mobile

However, this does not distinguish category columns or product columns.

Maybe you can provide me with a code to do it?
Thank you

Hello,

You can set the number of columns on mobile in the Theme Settings > Shop page > Product grid > find the option “Products columns on mobile” and set “2”

Best Regards

😀 yes I know I just told you above.
But as I wrote to you, this setting changes both categories and products.

If I put 2 in this setting, I will have two category columns and two product columns.
I want to get 1 category column and 2 product columns.
Is it clear to you what I want to tell you?

Hello,

Now it is quite clear, however, it is not possible as there is no option and it is not possible to correct with CSS either.

Best Regards

Hello
what I mean is that by default Woocommerce shows only 1 category in mobile.
You in the Theme have provided the ability to adjust the columns in mobile, which is great.
But your setting changes the columns of Categories and Products together.
I ask you how I can undo this change for one of the two: Categories or Products.
I want to get 1 Categories column, as Woocommerce provides by default, and 2 Products columns.

Do you have some code that I can insert in the functions.php file?
Thank you

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .col-6.category-grid-item {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

You need to set Products and categories in Customize > Woocommerce > Product catalog and set 2 columns in the Theme Settings.

Best Regards

OK thanks!
Positioned in mobile CSS is perfect!

You are welcome! If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts