'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.