Mity Docs Mity Docs for Mity Digital
Google Fonts Documentation

'googlefonts' tag

The 'googlefonts' tag makes it easy to use Spatie's Laravel Google Fonts package in your Statamic Antlers templates.

This addon is simply a wrapper for the Laravel Google Fonts package behaviour, and the Tag has been named following the same naming convention as the Blade directive.

Default font

The Googlefonts tag will load your "default" font. This is the font with the key of "default" in your config/google-fonts.php configuration file.

1<head>
2 ...
3 
4 {{ googlefonts }}
5 
6 ...
7</head>

If you use the Laravel Google Fonts documentation configuration, this will load the Inter font, which has the name of default in the configuration file.

A named font

The Tag is set up to also accept an additional parameter to load a named font from your config/google-fonts.php configuration file.

1<head>
2 ...
3 
4 {{ googlefonts:code }}
5 
6 ...
7</head>

If you use the Laravel Google Fonts documentation configuration, this will load the IBM Plex Mono font, which has the name of code in the configuration file.

Alternatively, you can also pass an explicit "font" parameter to do the same thing:

1<head>
2 ...
3 
4 {{ googlefonts font="code" }}
5 
6 ...
7</head>

This will also load the IBM Plex Mono font, which still has the name of code in the configuration file.

Loading multiple fonts

Loading multiple fonts is as easy as replicating the tag for each font, just like in Spatie's Laravel Google Fonts package.

1<head>
2 ...
3 
4 {{ googlefonts }}
5 {{ googlefonts:code }}
6 
7 ...
8</head>

This will load both the default and code fonts from the configuration file.

This means that if your site only needs a specific font on certain pages, you can opt to only load it when it is actually required.