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>

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