...
First of all, you will need the font file or files. It is recommended that you upload the woff2 font or fonts to the File and Image Library in Engaging Networks.
| Info |
|---|
If you need to download the Google Font, click the blue “Download all” button in their page. This will download them as a ttf file, but we recommend using woff2 instead. You can easily convert these using an online service such as this |
...
Collect the URLs of the fonts from the File and Image Library and save them for later.
In your blueprint template, you will first need to assign the font file to a font name. This requires you to write some CSS such as:
Code Block <style> @font-face { font-family: fancy-font; src: url(https://aaf1a18515da0e792f78-c27fdabe952dfc357fe25ebf5c8897ee.ssl.cf5.rackcdn.com/2208/fancy-font.woff2?v=1582628095000); } </style>Here, “fancy-font” is the name of the font. You’ll need this to assign the font to your text later. The “src” is the url of the font that you saved earlier.
Paste this into the Custom Fonts box, found under Fonts (advanced) in your blueprint template
To apply this font, select the “Other” option for your fonts and type in the name of your font where you want it applied (in this case it’s fancy-font). For example you might add it to the Default Font Family or Heading fonts.
We recommend you add a backup web safe font, in case your uploaded font doesn’t load for some reason. For example, sans-serif or Arial. To do this, you would type something like:
Code Block fancy-font, sans-serif
into the Other box. This means it’ll try and load the fancy-font first, and if that fails, it will try the web safe “sans-serif” font instead.
...