Woocommerce Heading Font Sizes

[Scubamobile]

Hi There,

I’m after a bit of advice, hoping you might be able to help me out.

If I am understanding things right Woocommerce Templates tend to overwrite the Heading Font settings - so I have set up the Heading settings for those element vis CSS.

The advice Im after is if this is a good way to be doing this or if maybe there is a better option out there you could point me in that direction.

When I run the code through a CSS checker I do get warning messages

Heading (H3) should be not qualified / Heading has already been defined

This is the code I have in CSS

.woocommerce .cart-collaterals .cart_totals h2 {
font-size: calc(14px + (24 - 14) * ((100vw - 300px) / (1600 - 300)));
}

.woocommerce-account form h3, .woocommerce-checkout form h3 {
font-size: calc(14px + (24 - 14) * ((100vw - 300px) / (1600 - 300)));
}

.woocommerce div.product .woocommerce-tabs h2 {
font-size: calc(14px + (24 - 14) * ((100vw - 300px) / (1600 - 300)));
}

.woocommerce div.product .summary .product_title {
font-size: calc(14px + (24 - 14) * ((100vw - 300px) / (1600 - 300)));
}

I have attached a screen shot of the code warnings.

Thanks in advance.

[friech]

Hi Nicky,

Thank you for writing in, you can ignore those CSS warnings, your custom CSS should still work. Worry if you see an error because besides that it would not work, it will affect your other custom CSS rule as well.

Yeah, there is no direct way of setting the headlines on Woocommerce page. Custom CSS might be the best way. Just always make sure to use a very specific selector so it does not affect the other headlines on your site.

Cheers!