Is it possible to add a special font (Google Font) to emails in Symplify?

Answer:

It is possible to add a special font for your emails. There are a few things you should know about the impact it can have.

Not all email clients support all special fonts (custom fonts). Outlook, Gmail and Android devices, for example, do not support them and will replace them with universal fonts (web-safe fonts like Arial, Times New Roman, Verdana, etc.). 

*Note that the universal fonts are those available by default in Symplify.

When an email client replaces the special font, it will try to find an equivalence in terms of font size. However, the 18px size of the special font does not necessarily correspond to the 18px size of Arial. This may cause a display issue.

 

Contact our support team or your account manager if you want to use your custom font.
Please provide us all font files. There are different font formats but .woff is the most important one since it has best support in email. If you have the files in the other formats (.eot, .woff2, .svg, .ttf), please send them too to cover more devices and clients.


If you use Skins for your boilerplate and you are familiar with CSS and Skins, you can add your custom font by yourself.

Always make a backup before you start making changes in Skins. For the backup, click att ”Options” and ”Backup settings currently in use” at the top right corner in Skins. Then, click at the link (Download a backup of your settings here) at the bottom right corner, to download the .txt-file.
When you right click the link, you can select the place were you want to save the file and rename it.
When you need the file, open it in a text editor and copy & paste the data to "Config Data" under ”Scripts
Note that you need to make a backup for every project you want to change - better be on the safe side.


Use <link> to import your font (google font or your own stylesheet with your font) and add the code into to "elements for <head>" input field in Skins in Scripts > Email

e.g: <link href="https://fonts.googleapis.com/css2?family=Open+Sans" rel="stylesheet" />

Ska_rmavbild_2021-04-16_kl._08.48.06.png


Go to the Style-Tab in Skins and add the font to the text style (Font Family) that should get your font. eg: 'Open Sans', Arial, sans-serif;

Ska_rmavbild_2021-04-16_kl._08.48.52.png

If you use 'Open Sans', sans-serif; (without a fallback font), email clients that can’t display text in custom font (like Outlook) will show the text in their sans-serif font.

You might need to update your settings in your project as well. If you can not see your custom font make sure that the project does not overwrite the account settings. You can not see your custom font when you edit your email but you can see it when you go to the Test or Summary Tab and see a preview of the email. This way, you see how the email will look in an email client that does not support and and in a client that does support your font.


If you want to use your fonts in another editor than email, add
<link href="https://fonts.googleapis.com/css2?family=Open+Sans" rel="stylesheet" />

to the respective ”elements for <head>” input.

Was this article helpful?
0 out of 0 found this helpful