Custom Font Not Applying to All Headers

Solved

Custom Font Not Applying to All Headers

JarnoBroekkamp
Excursionist
72 0 10

Hi everyone,

I recently installed a custom font for all my headers by adding it via @font-face in my theme’s CSS. The font works on some headers but not on others. Some sections still show the default theme font instead of my custom one.

Here’s what I did:

  1. Uploaded the font to Assets and added it to theme.css
  2. Applied it to headers using:

Any ideas why some headers are not updating? Could this be an issue with the theme’s default styles or dynamic sections?

 

I appreciate any help!

Thanks in advance. 😊

Image 15-03-2025 at 10.35.jpegImage 15-03-2025 at 10.38 (1).jpegImage 15-03-2025 at 10.38.jpeg

Accepted Solution (1)

Moeed
Shopify Partner
7333 1988 2424

This is an accepted solution.

Hey @JarnoBroekkamp 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
a.product-title.h6 {
    font-family: 'PP Editioral New' !important;
}
p.h1 {
    font-family: 'PP Editioral New' !important;
}
</style>

RESULT:

Moeed_0-1742198519868.png

Moeed_1-1742198538351.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Custom Design | Advanced Coding | Store Modifications


View solution in original post

Replies 2 (2)

Huptech-Web
Shopify Partner
1169 234 264

Hi @JarnoBroekkamp , Can you please share your storefront URL? It will help me understand the issue.

If you found this response helpful, please do like and accept the solution. Thanks!
Need support with Customizing your Shopify store?
Feel free to contact me at info@huptechweb.com or Visit our website Huptech Web.
Instant Shortcode Builder: Integrate customizable UI features anywhere in your store - No coding knowledge required

Moeed
Shopify Partner
7333 1988 2424

This is an accepted solution.

Hey @JarnoBroekkamp 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
a.product-title.h6 {
    font-family: 'PP Editioral New' !important;
}
p.h1 {
    font-family: 'PP Editioral New' !important;
}
</style>

RESULT:

Moeed_0-1742198519868.png

Moeed_1-1742198538351.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Custom Design | Advanced Coding | Store Modifications