CODEWITHSUNDEEP
csswordpresswoocommercecss-selectorselementor
mattiazm
mattiazm

Reputation: 129

How to change the background color of a specific WooCommerce category?

I have Elementor + WooCommerce. I have in my archive products page the following ->

All products; Category1 with its products; Category2 with its products.

Now, I want that in my archive products page, all the products related to Category2 have to have a blue background. Only the products related to Category2.

I can't find a way to do it, could you give me some help?

Upvotes: 1

Views: 945

Answers (1)

LoicTheAztec
LoicTheAztec

Reputation: 253869

In WooCommerce category archive pages there is a body class set for it that you can use to target specific product category. There is 2 possible ways using:

• product category term ID, (let say that term Id is 53):

.tax-product_cat.term-53 .elementor-my-element{ background-color: #0080FF; }

• product category term slug, (let say that term slug is category2 ):

.tax-product_cat.term-category2 .elementor-my-element{ background-color: #0080FF; }

where .elementor-my-element is the selector class of the element where you want a blue background (to be replaced by the correct real selector class of the html element).

Upvotes: 2

Related Questions