PHP API
Read the font library, get CSS variables and rebuild the stylesheet from your own code. Always check the plugin is active first:
if ( function_exists( 'nahnu_fonts_get_fonts' ) ) {
// Nahnu Fonts is active.
}
Functions#
| Function | Returns |
|---|---|
nahnu_fonts_get_fonts( $include_inactive = false ) | Active fonts (shape below). Pass true to include switched-off fonts |
nahnu_fonts_get_font( $slug_or_family ) | One font by slug (inter) or family (Inter), or null |
nahnu_fonts_css_variable( $slug ) | var(--nahnu-font-inter) |
nahnu_fonts_stylesheet_url() | The cached stylesheet URL with its version, or '' |
nahnu_fonts_rebuild() | Rebuilds the stylesheet and returns the build record |
The \NahnuFonts\Fonts class#
| Method | Description |
|---|---|
Fonts::get_fonts( $include_inactive = false ) | Same as nahnu_fonts_get_fonts(). Cached in the object cache group nahnu_fonts |
Fonts::get_font( $slug_or_family ) | Same as nahnu_fonts_get_font() |
Fonts::css_custom_property( $slug ) | --nahnu-font-open-sans |
Fonts::css_variable( $slug ) | var(--nahnu-font-open-sans) |
Fonts::slugify( $value ) | open-sans for Open Sans |
Fonts::clear_cache() | Clears the font cache and WordPress’s cached theme.json data |
Font data#
Each font is an array:
array(
'title' => 'Inter', // Display name.
'family' => 'Inter', // CSS family name in @font-face.
'type' => 'google', // google, custom or adobe.
'slug' => 'inter',
'active' => true,
'css' => array(
'slug' => 'inter',
'custom_property' => '--nahnu-font-inter',
'variable' => 'var(--nahnu-font-inter)',
'stack' => "'Inter', sans-serif",
'preset_slug' => 'nahnu-inter', // Block editor preset slug.
),
'variants' => array(
array( 'weight' => '400', 'style' => 'normal' ),
// Weight may be a range for variable fonts: '100 900'.
),
'fallback_family' => 'sans-serif',
'selector' => 'h1, h2', // "Apply to" selectors, or ''.
)
Examples#
List active families in a theme:
if ( function_exists( 'nahnu_fonts_get_fonts' ) ) {
foreach ( nahnu_fonts_get_fonts() as $font ) {
echo esc_html( $font['title'] ) . ': ' . esc_html( $font['css']['stack'] ) . '<br>';
}
}
Use a font’s variable in inline styles:
$var = function_exists( 'nahnu_fonts_css_variable' ) ? nahnu_fonts_css_variable( 'inter' ) : 'sans-serif';
printf( '<h2 style="font-family:%s">Hello</h2>', esc_attr( $var ) );
Load the stylesheet somewhere it isn’t loaded by default, such as a custom admin page:
$url = nahnu_fonts_stylesheet_url();
if ( $url ) {
wp_enqueue_style( 'my-page-fonts', $url, array(), null );
}
CSS output#
The stylesheet wp-content/uploads/nahnu-fonts/nahnu-fonts.css (style handle nahnu-fonts) contains:
@font-facerules for every active self-hosted font.:root { --nahnu-font-{slug}: '{Family}', {fallback}; }when CSS variables are on.{selector} { font-family: ... }for fonts with “Apply to” selectors..has-nahnu-{slug}-font-familyclasses on classic (non-block) themes.
Adobe Fonts load from Adobe with the handle nahnu-fonts-adobe. When the uploads folder isn’t writable, or “Print the CSS inside each page” is on, the same CSS is printed inline instead.