WordPress Theme Authors Are Moving to Host Fonts Locally

The WordPress Themes team is poised to change its guidelines on remote hosting Google Fonts and is once again strongly urging theme authors to host their fonts locally. Yoast-sponsored contributor Ari Stathopoulos published an update today to answer some questions the team has been receiving about fonts in themes:

Historically, WordPress themes hosted in the w.org themes repository were not allowed to use third-party resources. This included images, javascript files, CSS files, webfonts, and other assets loaded from a remote server.

Google fonts was an exception to this rule because, at the time, there was no reliable way to implement locally-hosted webfonts, and typography is an integral part of a theme’s design.

Google fonts, however, can no longer be considered an exception to this guideline because of the GDPR and privacy implications.

The team is responding to a recent German court case, which fined a website owner for violating the GDPR by using Google-hosted webfonts. This case spurred a few other threats against website owners and many questions for the Themes team.

What was previously a strong recommendation from WordPress.org is now a warning that guidelines will be changing imminently.

“A theme should not be allowed to use external resources,” Stathopoulos said. “The guidelines right now allow for remote Google fonts, but that will probably change soon. If the theme is using external assets, then yes, it should call a privacy function and ensure that these assets don’t get loaded without the user’s explicit consent.”

A ticket for updating WordPress’ default themes to load Google fonts locally has a patch but the milestone is set for WordPress 6.1. This will make all the core themes GDPR compliant but will not arrive until October.

Some theme authors saw the writing on the wall a few weeks ago and have been working to update their themes to load fonts locally.

“I’ve decided to do this too,” Rough Pixels founder André Jutras said. “Although a few themes have a font-choosing option in the Customizer with the full Google selection. This is going to be hard to change with existing users that use it. My new theme will definitely have local fonts.”

Offering font selection for users inside the theme is not as straightforward as simply including one or two fonts bundled with the theme.

“I’ve been trying to do the same with Blockbase,” Automattic developer Jason Crist said. “But Blockbase ships with a LOT of fonts to choose from so it’s been a bit of a unique challenge.”

In 2020, the Themes team created a package that helps theme authors host their webfonts locally. It was created in anticipation of removing Google Fonts as the exception to the rule prohibiting the use of CDNs to load assets.

Bunny Fonts are are an alternative to Google Fonts that some plugin authors have on their radar now that some European jurisdictions are cracking down on Google-hosted fonts. It is an open-source, privacy-first web font platform with no tracking or logging and is fully GDPR compliant. Bunny Fonts is compatible with the Google Fonts CSS v1 API so it can function as a drop-in replacement to Google Fonts by just switching the hostname. If the Themes Team was to add any service to its exception list, Bunny Fonts would be a more privacy respecting option than Google Fonts.

The Themes Team is waiting on core to implement better support for loading local fonts before making a sweeping requirement for themes hosted in the directory. In the meantime, WordPress theme authors have the time to update their themes to load Google Fonts locally before a requirement is put in place.

12

12 responses to “WordPress Theme Authors Are Moving to Host Fonts Locally”

  1. I understand why the theme team no longer wants to make an exception for Google Fonts.

    I can’t understand why Bunny fonts would be any different.

    Both claim to not store IPs, but I thought the reason for the court’s ruling was because IPs were sent to a 3rd party.

    • Bunnyfonts are gdpr compliant because the servers are hosted in the EU and dont take the data outside of the EU which means that gdpr can be enforced. Bunny CDN has to make all of their sourcecode available to inspection by eu officials.

  2. I had concerns about my previous themes using the built-in Google fonts set of options in the customizer when I read about that court case. However, I had to begin making notes on how to implement changes without causing too much strife for people using my themes.

    Careful planning and adjustments are key to making this work, but I believe I can begin the transition with my older themes. I will be starting shortly. At least my latest theme was built with localized fonts; as will all future themes.

    One has to consider what will be next; which is a good reason to keep theme (+plugin) feature development to a minimum. Adding too many third-party resources can become a problem later.

  3. Are Fetch calls within JS considered using external resources as well, such that the browser/user’s IP will be sent as the remote address in the http request? If so, would the alternative be making the fetch call to a proxy server, which will then make the api call to the external resource?

  4. This is a good thing. I’m moving over to bunnyfonts, works just fine.

    But this does not entirely eliminate loading google fonts. We have reCaptcha enabled in cf7, which causes fonts to be loaded directly from google fonts.

    I guess this cannot be fixed as reCaptcha is a Google service …

    • In ninja forms you can do to ask a question and if it’s not the exact answer then it won’t go through…think like asking what 5+5 is. If 10 is not the answer inputted……..does not go through.

      I am sure there is a local reCaptcha plugin that does not use Google service.

    • My reading of the original case was that it was less about Google’s handling of data and more about the fact that data was processed through a 3rd Party when it was unnecessary.

      In the notes I saw it said services like “Google fonts”. I imagine the same case could be made against others.

  5. There is a plugin I use…I can’t remember if it is from a WPTavern post or comment on here.

    Local Google Fonts: https://wordpress.org/plugins/local-google-fonts

    I understand the reason for third-party usage, like Gravatar, I don’t have to upload a 512×512 (or whatever size) to every site I manage.
    Obviously the disadvantage is having to upload the same file on different sites. If you want to update it, repeat the process, With Gravatar it is one upload for all sites.

    I’ve been pushing away from third-party usage like Akismet and Google Analytics. Anything that I have to connect somewhere else.

  6. I did this with all my themes a few months ago, using Ari’s package to automatically download and load the Google fonts locally.
    I did the same thing with the Font Awesome library.

    One thing that really surprised me is the incredible PageSpeed Insights gains that I immediately got from this change alone.

    My mobile performance rating jumped from ~50 to 95+, with the LCP dropping from ~7 seconds to under 3 seconds.
    Once I saw the results of this ~15 minute change, I did that across most of my websites.

    So my advice is to test your PageSpeed before and after this change, just for the fun of it. You might be pleasantly surprised!

  7. The european law as far as i understand it takes issue with google fonts because the data travels out of the EU to the USA since googles servers are outside of the EU and gdpr cant be enforced.

    Bunnyfonts are hosted in the eu for this reason.

    • Hi Derin. I think it’s not just the location of the server, but if the page links in any way to external resources – such that when the user loads the page or makes an action, an external server is being requested for (i.e. js, css, images or api calls) and the user’s IP can be logged by the external server.

  8. It’s not just the GDPR, there are several other benefits in using local fonts. From https://fontsource.org/docs/introduction :

    – Self-hosting brings significant performance gains as loading fonts from hosted services, such as Google Fonts, lead to an extra (render blocking) network request. To provide perspective, for simple websites it has been seen to double visual load times. Benchmarks can be found here and here.

    – Fonts remain version locked. Google often pushes updates to their fonts without notice, which may interfere with your live production projects. Manage your fonts like any other NPM dependency.

    – Commit to privacy. Google does track the usage of their fonts and for those who are extremely privacy concerned, self-hosting is an alternative.

    – Your fonts load offline. On top of benefiting PWAs, often there may be situations, like working in an airplane or train, leaving you stranded without access to your online hosted fonts. Have the ability to keep working under any circumstance.

    (Also this was one of the reasons for the recommendation to not merge the Webfonts API to WordPress 5.9.)

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Newsletter

Subscribe Via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

%d bloggers like this: