Custom fonts not displaying in Gmail or Yahoo, but are in Apple Mail
SOLVE
Hi there 😊
We are working on a rebrand for our company including our email templates. Leadership would like to see our corporate fonts integrated into our emails, Bookman and Metronic. I am struggling to get email clients to read the CSS we've written.
We have uploaded our fonts as .woff and .ttf files, referenced them in our style sheet, and call them in-line. We're using the @font-face method, @import method, and referencing an external stylesheet as well (though I've read that this will not help us? Not sure if that's accurate).
With great effort I have been able to successfully have our fonts display in Apple Mail for iOS, but no other platforms are working; Not Gmail nor Yahoo. I am at a loss for how to get these fonts to display in any other email client. Any suggestions/help would be greatly appreciated.
Below is the Design Manager and the CSS in the <head> area:
Here is the Email Editor with the styles in-line:
Here is the email in Apple Mail on iOS. Fonts are in BookmanOldStyle and MetronicSlabNarrowLight which is what we want.
Here is the email in Gmail on iOS (please disregard dark mode). Shows Georgia and Helvetica (I think?).
Thank you for the information provided, based on this article from our KB, adding custom fonts using @font-faceand @importare only supported in Apple Mail and a few other email clients.
Please note: while Google Fonts are available in custom module font fields, Google Fonts cannot be used for email. This is because custom fonts are widely unsupported in email clients. Instead, only the default system fonts will be available in your custom module.
I hope this helps
Thanks
Sharon
Did you know that the Community is available in other languages? Join regional conversations by changing your language settings !
Custom fonts not displaying in Gmail or Yahoo, but are in Apple Mail
SOLVE
Hi, I am Cristina Morera.
I need to import some fonts that we use in our webpage to landing pages and emails. Support team said that for custom fonts I would need to copy the fonts import code, paste it into the pages stylesheet, then apply the font with CSS rules. I have never tried anything with CSS, could you help me try this out?
Custom fonts not displaying in Gmail or Yahoo, but are in Apple Mail
SOLVE
Thanks tjoyce -- Side question based on the article you referenced; We added a link to our style sheet at the top of the first screenshot. Do you know if our syntax is correct for optimal compatiblity?
Thank you for the information provided, based on this article from our KB, adding custom fonts using @font-faceand @importare only supported in Apple Mail and a few other email clients.
Please note: while Google Fonts are available in custom module font fields, Google Fonts cannot be used for email. This is because custom fonts are widely unsupported in email clients. Instead, only the default system fonts will be available in your custom module.
I hope this helps
Thanks
Sharon
Did you know that the Community is available in other languages? Join regional conversations by changing your language settings !