Before starting, please note it is not recommended to use custom fonts as not all email clients can read and correctly display these.
If, for any reason, the email client can't read your custom font, a default font will be used to display the email in that particular email client.
Adding a custom font, step by step:
Get your custom font ready (you can use Google Fonts, for example).
Grab the custom font code. See the following example from Google Fonts:
Go back to MailerLite's Drag & Drop editor and add a Custom code block at the top of your newsletter.
Paste the custom font code and save. You can now start using the font anywhere in the newsletter!
You can select where the custom code should be used:
To use it on all text blocks in the campaign, you need to add another piece of code in the same custom code block:
<style>p { !important }</style>
After adding it, head to the Google Fonts page and copy the text under CSS rules to specify families.
Between the curly brackets{ }and before!important, paste the text you copied in the previous step, as shown in the example below:
<style>p { font-family: 'Acme', sans-serif !important }</style>
Note: Acme is the name of the custom font, and Sans-serif is the style for that particular font. If the custom font is not supported, then the email client will display a default font.
To use the custom font in the entire campaign, including text, title, subtitles, and buttons, replace the
pwith an asterisk*.
<style>* { font-family: 'Acme', sans-serif !important }</style>
Note: Replace the property font-family: 'Acme', sans-serif; with your font’s respective name, which can be obtained from the side panel in Google Fonts, under CSS rules to specify families.