Fonts

When creating a new website you'll probably want to add your own fonts as well. You can do this in two ways.

Using an enqueue hook (external hosting)

The first is to enqueue an external stylesheet by using the wp_enqueue_scripts and enqueue_block_editor_assets hooks in your child theme.

Add them to your assets (provide fonts locally).

You might want to host the fonts locally for several reasons. One of them is that you are not dependent on external CDN's. If the design requires a Google font you can download it locally via this tool.

Once downloaded you can add the fonts to the resources/fonts/FONTNAME folder and include the generated stylesheet to resources/style/01-settings/_fonts.scss

⚠️ Make sure to update the filepath when generating the font when using the above tool.

Add font-family value to variables

When you've added your font you will now have to add the font variables in your _variables.scss. Read basic styling for more information about overwriting variables.

Copy
$base-font: "Lato", sans-serif;
$secondary-font: "Noto Serif", serif;