Change font size of Woocommerce cart and checkout

[HolyRecipe]

Hi there, I have tried to optimize the font size of h1 in my woocommerce cart.
The cart can be seen here https://holyrecipe.com/

I have used the following in Global CSS:

.woocommerce.cart.h1 {
font-size: 180% !important;

Please see screenshot

I have deleted Cache afterwards, but the font has not changed - do you have any idea why?

THank you! Aline

[prakash_s]

Hello @HolyRecipe,

Thanks for writing to us.

It seems that the CSS selector is not correct. I would suggest you use this CSS selector “.woocommerce-cart h1”.

.woocommerce-cart h1{
  font-size: 180% !important;
} 

The purpose of providing custom CSS is to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector or you can subscribe to One to get further assistance.

Hope it helps.
Thanks

[HolyRecipe]

Thank you so much - that worked and helped a lot!
But now - of course - also the H1 headline in the footer changed and turned out bigger than before (but only on the cart and checkout) please see screenshot

After

Can you let me know how I can exclude the h1 headers in the footer from this rule?

And of course, I understand that CSS is out of scope, thank you!

Best, Aline

[marc_a]

Hi Aline,

You can use this CSS selector to target the H1 inside your content.

.woocommerce-cart .entry-header h1 {
	// your css code here
}

Friendly Note: You should have one h1 on your page as best SEO practices.

Hope that helps.

[HolyRecipe]

Thank you so much! All worked out well now

[tristup]

Hi Aline,

Glad that we are able to help you.

Thanks