Add font-display: swap to locally hosted fonts

Hi there,

You can add this to your @font-face declarations in the CSS.

So if it's a locally hosting font, it means you've done something like this:

@font-face {
    font-family: My Font Name;
    ...etc...
}

Just update it like this:

@font-face {
    font-family: My Font Name;
    font-display: swap;
    ...etc...
}

Hope this helps :)

Hi,
i tried the same and even when i added the css code above to my main stylesheet google pagespeed tester is still showing that issue on my site.

On this page it says that you have to do an additional task to make sure the pagespeed-speed issue will not come again: https://web.dev/font-display/ (Headline: Google Fonts in the middle of the page).
Where do i have to add that: &display=swap parameter on my site?

My Site is https://www.nebenbeionline.de and i want to make sure that my Site is running fast like hell :).

regardly
Ferhat

Hi there,

The first font it's mentioning are our theme icons. Instead of using font-display, use our SVG icons: https://docs.generatepress.com/article/svg-icons/

The last font it's mentioning are the social icons by your Social Icons by WPZoom plugin.

Thanks Tom! And keep up the good work.

No problem! Thank you :)