Font family

Summary

Configure font family

 
Steps
  1. Navigate to ‘Administration’ and then select ‘Font family’ option located under ‘Branding’

 

‘Font family settings’ tab

 

2. Add a CSS selector to column one, e.g.

p

paragraph

body

body

h1

Heading one

h3, h4

Heading three and four

.breadcrumb

<div class=”breadcrumb”>

Please note: Other selectors for less common text elements can be identified by using inspect element

 

3. Add the name of your font family in the second column, e.g. if you uploaded the font face ‘OpenSans-Bold.ttf’ and gave it the CSS font family name ‘Open Sans Bold’, then add this name ‘Open Sans Bold’ to the second column

4. This will link or apply the font face style ‘Open Sans Bold’ to the CSS selector

5. Select ‘Submit’

 

Remove font family

  1. You can remove a font family from a selector by selecting the bin icon located next to it

 

Export font family

  1. Select ‘Export styles’

 

‘Font family import’ tab

  1. Import font family settings by uploading a JSON file from a previous export
  2. Select ‘Add File’ to view files on your local drive
  3. Select the font file to add, e.g. ‘intranet_font_family_values.json’
  4.  Select ‘Upload’
  5. You should see the file name displaying next to the ‘Add File’
  6. Select ‘Submit’
  7. View ‘Font family settings’ tab to check font family has been added 
 
Expected result

The font family has been added/updated

 
Roles/permissions

Brand manager