How to add custom font to email templates? | Community
Skip to main content
New Participant
June 2, 2021
Solved

How to add custom font to email templates?

  • June 2, 2021
  • 1 reply
  • 16264 views

I have 2 custom fonts (Sailec and Recoleta) that I want to use in my Marketo emails. I have already uploaded the .woff2 and .woff files into a font folder in Design Studio. What are my next steps to start using these fonts in my emails? I would like Sailec and Recoleta to be my main fonts in that order but have Arial, and Georgia fonts as fall backs.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by SanfordWhiteman

I'm not sure if there's something else I'm still missing but I input the below code in the <head> of my email like the Litmus link you provided suggested.

 

<link href="http://pages.newrez.com/rs/152-KAN-566/images/RecoletaW05-Regular.woff" rel="stylesheet" type="text/css" />

 

And for the fallback font, it's currently set up as font-family: SailecW05, arial, georgia, helvetica, sans-serif; but I'm not seeing the font change in my emails. So I'm not sure if there's something else that I'm missing.



I'm not sure if there's something else I'm still missing but I input the below code in the <head> of my email like the Litmus link you provided suggested.<link href="http://pages.newrez.com/rs/152-KAN-566/images/RecoletaW05-Regular.woff" rel="stylesheet" type="text/css" />

That's the URL of the binary WOFF file. If you use the <link> method it needs to point to a CSS stylesheet that in turn references the font file.

1 reply

SanfordWhiteman
New Participant
June 2, 2021

Hi,

 

You can follow Litmus's guide here: https://www.litmus.com/blog/the-ultimate-guide-to-web-fonts/

 

There's nothing particularly special about Marketo w/r/t webfonts: they don't work in all clients by a long shot, but you can add them to any template.

emily001Author
New Participant
June 2, 2021

Got it. This link is really helpful. I do have one question though, if I uploaded my fonts into Marketo, am I able to use that URL provided in Design Studio in my email template code or is there another place I need to upload/host the files in, in order to embed with <link>, @import, or @font-face methods?

SanfordWhiteman
New Participant
June 2, 2021

if I uploaded my fonts into Marketo, am I able to use that URL provided in Design Studio in my email template code or is there another place I need to upload/host the files in, in order to embed with <link>, @import, or @font-face methods?

Yes, just test-test-test.