Site logo

Archived topic

Woocommerce category list different to product list

7 replies · Started by David on February 22, 2022

Viewing posts 1–8 of 8

Hello

Is it possible to change the view so it's different on woocommerce when your'e viewing categories, too when your'e viewing a product list.

Here I have a 3 column category list, which I'm happy with...
https://www.zepfdentalinstruments.co.uk/product-category/02-diagnostics/

Password is : zepf123 to view the site.

And when they click through a category I would like to change the product view so it's only 1 column rather than 3.
https://www.zepfdentalinstruments.co.uk/product-category/03-parodontology/0306-knives-hoes-chisels/

Also I need to change the styling so the title isn't on a grey background, but I can't see anything different in the css, to be able to separate them.

Thanks
Dave

Thanks Leo, Is there an easier way to do this? I would have to list so many categories, doing it this way, plus if a new category is added, it won't use the 1 column unless I add it to the functions.

Basically it needs to use 1 column if the category is showing products and 3 columns if the category is showing sub categories.

Thanks
Dave

Hi Dave,

That's going to require a significant amount of customization.

While we can just do a foreach loop, querying for category term, it will be a nightmare for the database.

Example: if you have 40 category terms, that means there will be 40 queries. The server might struggle with this.

Consider hiring a third-party developer as this will require some heavy programming as there are things to really consider like "if the site eventually has 10 or more categories, do we AJAX the other category term queries so the first load doesn't get too heavy?"

This needs planning w/ a dev. :)

Hi there,

you have this CSS that adds the background color:

#wc-column-container .product {
    border: 1px solid #e3e3e3;
    background: #323232;
}

Change it to:

#wc-column-container .product-category {
    border: 1px solid #e3e3e3;
    background: #323232;
}

Thanks David

You're welcome

This archived topic is closed to new replies.