How can I use webfonts in my emails?

Overview

Webfonts are fonts that come directly from the Internetare loaded. These help you to ensure the appearance of your emails andUnify your website.

TheEmail templates ComfortandPremiumAllow you can integrate individual web fonts.

Webfonts are not included by all email clientsSupported

You can find detailed guidelines on the support of web fonts in this litmus article.

How to incorporate web fonts

1. Select font

Choose a webfont provider likeGoogle FontsOrAdobe Fonts. . Select the desired font/cuts there and have the code for embedding displayed. Use them@import Instruction:

Copy the selected code section to the clipboard.

Alternatively, you can host web fonts directly on your own server. To allow linking, the CORS header must be enabled for your redirect domain. The fonts must be provided in the WOFF2 format.

2. Add the webfont to your mailing or branding content

In the next step, you insert the selected code into the branding - either in the branding setup of the mailing or in the branding content (Module > Templates > Contents). Open the branding and go to the section Fonts and sizes:

1. Input "CSS - embed web fonts here"
Paste the copied source code (using the @import syntax):

2. Input "CSS"

Here you can specify the fonts and font styles for specific elements in your mailing. Add the name of the font to the “font-family” attribute using single quotation marks.

The font family can by applied to the following classes (in excerpts):

.font: applies to all fonts in the mailing.
.h1, .h2, .h3: Applies only to the respective headlines.
.text-small, .text-medium, .text-large: Applies to regular text/paragraph elements.

Once you've saved the changes to the branding content, you'll need to re-read the branding into your mailings to make it visible.

Support

Contact usIf you have any questions about this topic.