Why isn't my custom font GT-Pressura working on my online store?

Store Design
1

Hi! I’m hoping to find out what I’m doing wrong with uploading my custom font. I’ve done this half a dozen times before with no problems. Here is my CSS:

@font-face {
font-family: ‘GT-Pressura’;
src: url(‘GT-Pressura-Bold.woff2’) format(‘woff2’),
url(‘GT-Pressura-Bold.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: ‘Oakes Grotesk’;
src: url(‘OakesGrotesk-Regular.woff2’) format(‘woff2’),
url(‘OakesGrotesk-Regular.woff’) format(‘woff’);
font-weight: normal;
font-style: normal;
font-display: swap;
}

p, span { font-family: ‘Oakes Grotesk’ !important; }

h1, h2, h3, h4, h5 { font-family: ‘GT-Pressura’ !important; }

The weird thing is Oakes Grotesk works just fine but GT-Pressura doesn’t. Both fonts are uploaded to my assets folder in .woff and .woff2 format and the custom CSS is in the custom-styles.liquid folder as per my theme’s set up (Emerge.)

Any ideas?

2

Hi @JeanM

I hope you have uploaded font on assist folder,

@font-face {
font-family: 'GT-Pressura';
src: url({{' GT-Pressura-Bold.woff2' | asset_url }}) format('woff2'),
url({{'GT-Pressura-Bold.woff' | asset_url }}) format('woff');
font-weight: normal;
font-style: normal;
font-display: swap;
}

just add correct path in css

1 Like
3

Check out This

https://help.gempages.net/articles/how-to-upload-custom-font-to-your-shopify-store

4

Hi,

This is what I’ve done - do you see errors in my code?

5

Thank you!

That solved it for me.

6

hi @JeanM

You did not added

| asset_url

7

Hey! Thanks for the advice on downloading fonts. I just found bullet journal fonts and select several options for my blog. But I am having technical problems downloading, now I will try your advice!

bullet-journal-fonts-2048x996.png
bullet-journal-fonts-2048x996.png2048×996 460 KB