[Resolved] Vertical List Product Categories

[Alberto]

Hi.

I have some woocommerce products that belong to more than one category. In the product view, the categories are all displayed online, one after the other.

Would it be possible to display all categories in list format, that is, one below the other?

Thank you in advance.

[David]

Hi there,

the CSS is simple enough:

.single-product .product_meta .posted_in a {
    display: block;
}

However the , separator cannot be removed easily using CSS without removing the word Categorías as well.

To remove the comma you would need to copy this template to your child theme:

https://github.com/woocommerce/woocommerce/blob/7701d4b57cb20dc89e25bb7bf2ff872d85f4c535/templates/single-product/meta.php#L34

And on Line 34 that i have highlighted change it to:

<?php echo wc_get_product_category_list( $product->get_id(), '', '<span class="posted_in">' . _n( 'Category:', 'Categories:', count( $product->get_category_ids() ), 'woocommerce' ) . ' ', '</span>' ); ?>

[Alberto]

Thank you very much for your answer, David

I downloaded the template called meta.php and copied it to the generatepress_child theme folder.

I have placed the css code that you indicated and I can see the categories in the list, but I still see the commas …

I don’t know if I’m doing something wrong.

I am testing on my local server so as not to compromise the production site.

Thanks since now.

[David]

The file needs this folder structure:

child-theme/woocommerce/single-product/meta.php

[Alberto]

Thanks, David!

It worked perfectly!

[David]

Awesome 🙂 Glad to be of help

[Author]

Posts