product title

Hi,
in homepage I have a “product categories” widget and in order to have the categories name styled as I want (screenshot attached) I used this css:

.wd-entities-title {
	background-color: #ff0000;
	color: white !important;
	padding: 10px;
	border-radius: 15px;
}

it works, but with this css I also styled the products name the same. Instead I’d like the products name (here for example https://formacultura.com/shop/) to be simple black, same color, font-size and font-family of the price.

Can you please suggest a more specific element in order to target only the categories name in the “product categories” widget? I see that .wd-entities-title is too generic.

thank you

Attachments:

You must be logged in to view attached files.

Hello,

The .wd-entities-title class is used globally for both product titles and category titles, which is why your CSS affects product names as well.

To style only the category names inside the Product Categories element/widget, please use this css code:

.wd-cat .wd-entities-title {
    background-color: #ff0000;
    color: #fff !important;
    padding: 10px;
    border-radius: 15px;
}

The .wd-cat class is specific to category items, so this CSS will only affect category titles and will not modify product titles on your shop page.

Best Regards

[Author]

Posts