Unsolvable - Custom font doesn't show on mobile (DAWN theme)

Store Design
, , ,
1

Hi! I have uploaded a custom font to my webshop which shows perfectly on desktop in the headings but never on mobile. I have tried all the solutions under similar posts, but nothing worked.

I have uploaded all font types into Assets and inserted the following code into base.css:

@font-face {
font-family: “FashionFetish”;
src: url({{ FashionFetish | asset_url }}) format(“woff2”);
src: url({{ FashionFetish | asset_url }}) format(“woff”);
src: url({{ FashionFetish | asset_url }}) format(“otf”);
src: url({{ FashionFetish | asset_url }}) format(“svg”);
src: url({{ FashionFetish | asset_url }}) format(“ttf”);
}

h1{
font-family: “FashionFetish”;
}
h2{
font-family: “FashionFetish”;
}
h3{
font-family: “FashionFetish”;
}

Could you please tell me how to fix it for mobile view?

Thanks in advance!

2

Hi, @finesake

change top code

and your font file must be in .woff2 file

@font-face {
  font-family: 'YourFontName';
  src: url('https://yourfonturl.com/yourfont.woff2') format('woff2');
}
3

Hi! Do I need only woff2 file, and not the rest? And how do I find out the URL?

4 
*https://fonts.cdnfonts.com/css/fashion-fetish*
5

Thank you, but unfortunately doesn’t work, and now not even with firefox browser. I put my previous code back in the meantime, but only works on Chrome desktop.

1 Like
6

I have solved with the AZ application in the meantime, since I couldn’t modify it with a code on all browsers. It was a bit of a hassle but it works now.