Skip to main content
Appearance

Using custom fonts in your Customer Portal

Set heading and body fonts for your Customer Portal and Help Centers from Google Fonts, an uploaded font file, or a font URL.

Written By Markus Palm

Last updated 7 minutes ago

Overview

You can set one font for headings and one for body text across your Customer Portal and every Help Center. The default font is Inter.

Choose a font from a list of 40 Google Fonts, upload your own font file, or link to a font that is already hosted. To change fonts, you need the Manage Branding permission.

Choose a font from the list

  1. Go to Settings → Customer Portal → Brand & colours

  2. Under Fonts, open the font menu beside Headings or Body

  3. Choose a font from the Sans, Serif, or Mono group

  4. Optional: choose a weight in the menu beside the font

  5. Click 'Save changes' in the page header

Before you save, check the change in the preview. Switch the preview between Portal and Help Center to see both.

The weight menu lists only the weights that the chosen font has. Default keeps the standard weights of the portal. A number sets one weight for all headings or for all body text.

Upload a font file

Featurebase accepts .woff2, .woff, .ttf, and .otf files up to 2 MB. The font name can contain letters, digits, spaces, and hyphens, up to 64 characters.

  1. Under Fonts, open the font menu beside Headings or Body and choose 'Upload a font…'

  2. Select the font file

  3. Check the font name that Featurebase suggests from the file name

  4. Click 'Upload'

  5. Click 'Save changes'

The row then shows Custom file and the font name. Its weight menu offers every weight from 100 to 900, because Featurebase cannot tell which weights the file contains. To use a different file, click 'Replace'.

Use a font URL

Featurebase accepts a Google Fonts link that starts with https://fonts.googleapis.com/css2, or an https:// link to a .woff2, .woff, .ttf, or .otf file.

  1. Under Fonts, open the font menu beside Headings or Body and choose 'Use a font URL…'

  2. Paste the link

  3. For a link to a font file, enter a font name. For a Google Fonts link, Featurebase takes the name from the link

  4. Click 'Use'

  5. Click 'Save changes'

The row then shows Custom URL and the font name.

Important: The server that hosts a font file must allow cross-origin font requests. Otherwise, browsers cannot load the font, and customers see a system font instead.

Reset a font

Choose Default (Inter) at the top of the font menu. For an uploaded font or a font URL, click 'Remove' beside the font name. Then click 'Save changes'.

FAQs

No. Fonts apply to your Customer Portal and every Help Center, including the Help Centers of other brands. When you choose another brand on Brand & colours, you can change its name, logo, and colors, but not its fonts.

Featurebase accepts a Google Fonts link with exactly one font family and, optionally, its weights, for example https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700. To use two Google Fonts, put one in Headings and the other in Body.

A saved font breaks one of the font rules, for example a font name with characters that are not allowed, so Featurebase does not load it on your site. The message names the problem. Replace or remove the font to fix it.

Still need help? Ask the team