automattic/jetpack-google-fonts-provider

WordPress Webfonts provider for Google Fonts

Installs: 8 097

Dependents: 1

Suggesters: 0

Security: 0

Stars: 4

Watchers: 6

Forks: 1

Type:jetpack-library

v0.7.2 2024-03-18 17:10 UTC

README

WordPress Webfonts provider for Google Fonts

How to install google-fonts-provider

Package is published in Packagist. We recommend using the latest version there. You can install it in a composer managed project with composer require automattic/jetpack-google-fonts-provider.

You can also test with the latest development versions like below:

"require": {
    "automattic/jetpack-google-fonts-provider": "dev-trunk"
}

Usage

The WordPress Webfonts API is available by activating the Gutenberg plugin and is planned to be included in WordPress 6.0.

Register the provider

This package contains the provider class, but the provider needs to be registered before it can be used.

wp_register_webfont_provider( 'google-fonts', '\Automattic\Jetpack\Fonts\Google_Fonts_Provider' );

Register fonts

After registering the provider, you can register any of the fonts available in the Google Fonts catalog to make them available for use in the block editor typography settings, Global styles, and your site's CSS.

wp_register_webfont(
		array(
			'font-family' => 'Lato',
			'provider'    => 'google-fonts',
		),
);

Add preconnect link

Adding a preconnect link to the <head> of the page will help make sure the font files load as soon as possible, and reduce the layout shift when they are displayed. See this list of webfont best practices for more details. To do so, we can rely on WordPress' wp_resource_hints filter like so:

add_filter( 'wp_resource_hints', '\Automattic\Jetpack\Fonts\Utils::font_source_resource_hint', 10, 2 );

Additional info

For a discussion about the Webfonts API in WordPress, see https://make.wordpress.org/core/2021/09/28/implementing-a-webfonts-api-in-wordpress-core/.

Using this package in your WordPress plugin

If you plan on using this package in your WordPress plugin, we would recommend that you use Jetpack Autoloader as your autoloader. This will allow for maximum interoperability with other plugins that use this package as well.

Security

Need to report a security vulnerability? Go to https://automattic.com/security/ or directly to our security bug bounty site https://hackerone.com/automattic.

License

Jetpack Google Fonts Provider is licensed under GNU General Public License v2 (or later)