Adding a Custom Font to the Cascade Theme

Highlighted
New Member
1 0 0

Hello,

I recently purchased the Cascade theme, and I was wondering if someone could help me figure out how to add my custom font. I've already added my webfont files to the Assets folder. I know that some variation of the following code needs to be added to the theme.css.liquid sheet (with my font file name instead of "FONT," of course):

@font-face {
  font-family: "FONT";
  src: url('{{ "FONT.eot" | asset_url }}');
  src: url('{{ "FONT.eot" | asset_url }} ?#iefix') format("embedded-opentype"),
       url('{{ "FONT.woff" | asset_url }}') format("woff"),
       url('{{ "FONT.woff2" | asset_url }}') format("woff2"),
       url('{{ "FONT.ttf" | asset_url }}') format("truetype"),
       url('{{ "FONT.svg" | asset_url }} #FONT') format("svg");
}

Now, here's where I'm stuck. Once this is done, how do I customize that font style for various headings, including my menu? Any input on this would be so helpful!

Thanks!

0 Likes
Highlighted
Trailblazer
220 9 27

Hey,

Welcome to Shopify!

I think you can simply insert the font as an HTML rel tag (or simply the CSS you wrote) in your theme's header.liquid file, but that can cause serious damage to your store if you unfamiliar with changing the theme's files.

 

Good luck!

0 Likes