I understand and have the basic code for adding a custom font to match my website (files hosted through Shopify).
However, I have 3 brand fonts, and I was hoping to assign different custom fonts to the different header font styles, and have H1 / H2 / H3 all be unique fonts.
Does anyone have any insight or have the code to do this? Any help would be so appreciated!!
Thank you so much for the help :)
Best answer by Julia.LiMarzi
Interesting that one would work but not all three. I have a couple of questions that might help pinpoint the issue:
- Just to confirm, are all 3 codes snippets within one text box?
- Is the first snippet the only one displaying the font?
- If so, try changing which font or snippet is listed first. This will pinpoint if the problem is having 3 snippets of that code or the font itself is blocked from showing.
- Are all your font files .woff format? The sample code above uses that, but you may be using .woff2 on your store. If that’s the case, try updating the snippet for the relevant fonts to say .woff2 instead of .woff.
To answer the second question, because you are using a custom font that isn’t a programmed option in Klaviyo’s template editor, I believe you’ll need to use HTML to manually set and update the text formatting within the source code.