In addition to standard and nonstandard Stripo fonts, you can add custom fonts to the editor.

To install the custom font in Stripo account, you need to:

  • click account name at the top right corner of the screen;

  • select Organization Settings;

  • you will see the Projects tab on the left – click it;

  • select the project you are going to enrich with a new font (I have only one project);

  • click the Settings button;

  • scroll down to see Manage Fonts section;

  • click Add custom font button (I have already added three custom fonts);

  • in the drop-down form, name your custom font, paste embed URL and insert font group specified by Google.

An important note: for your convenience, we strongly recommend you to give custom fonts their real names.

After filling in all the fields correctly, click Connect.

Now you will see new fonts in the drop-down list.

Please, be aware, in the editor after adding the custom font, you will be able to check only the font with font-weight "400". If you need to have any other font-weight values, you can add them via 1 link to the settings of the Project.

However, you need to set up different values manually in the code through "font-weight" in the tag style to the text.

For example:

In addition, watch our step-by-step video tutorial on how to add fonts in Stripo.

You would like to add your custom font which is nor present on Google fonts

Please be advised that if you have a license for a paid custom font and want to use it in emails, then you need to:

  • create a CSS file in which you describe the styles for connecting this font on your server;

  • add a link to this CSS file into your account in Stripo;

The example of the code in the css file:

@font-face {

font-family: 'custom_font_name';

font-style: normal;

font-weight: 400;

src: url('absolute_path_to_font_file') format('woff2');

}

Where an absolute_path_to_font_file should look similar to this:

https://website.com/fonts/customFontName.woff2

Please note that you also need to check CORS policy for your fonts.

You can find more about CORS policy here.

Did this answer your question?