Hard time adding custom font

Highlighted
New Member
2 0 0

Hey everyone, I tried this post already but the situation is a bit different in my case.

 

The font is present in my assets folder, and I can get it by the url: //cdn.shopify.com/s/files/1/0448/4317/2005/t/1/assets/praktika-bold.woff2?v=9663179740147015344" 

@font-face {
  font-family: 'PraktikaRnd-Bold';
  src: url('{{ "praktika-bold.woff2" | asset_url }}') format('woff2'),
  url('{{ "praktika-bold.woff" | asset_url }}') format('woff');
  font-weight: normal;
}

That's on my theme.liquid file.

But I'm still not getting any change in my store, I even tried to use that same src for a quick "hello world"-ish local html file and it worked there, but not on my shopify store, any clues to what I'm doing wrong here?

0 Likes
Highlighted
Astronaut
1083 178 213

Hey,

1. In your theme.liquid file, find the </head> (press CTRL + F or command + F on Mac)
2. paste this code right above the </head> tag:

<style>
@font-face {
  font-family: 'PraktikaRnd-Bold';
  src: url('{{ "praktika-bold.woff2" | asset_url }}') format('woff2'),
  url('{{ "praktika-bold.woff" | asset_url }}') format('woff');
  font-weight: normal;
}
</style>


The issue is that you're adding a CSS code directly into a .liquid file. To make it read CSS you should put it inside style tags. 

Let me know whether it helps you!

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes