How to Disable Google Fonts in WordPress 

Google Fonts is a font library that allows websites to load custom fonts hosted on Google’s servers. It’s a free service that is very easy to work with. While using them is convenient, there are situations and reasons why you might need to disable Google fonts in WordPress. 

It could be due to privacy concerns, such as data tracking by Google, or performance improvements, like reducing load times by eliminating external resources. GDPR (General Data Protection Regulation) compliance might be another driving reason for European site owners. 

Therefore, managing your website’s fonts on WordPress is crucial for the site’s performance, privacy and legal compliance.  

When and why to disable Google Fonts  

Performance boost: 

The font style used on your website affects your user experience and design. With widespread font customization available that is easy to use, many people opt for Google Fonts. However, loading too many fonts can affect your website’s speed.  

Each time a page loads, it has to make an external request to Google’s servers to fetch the font files. Such multiple requests can slow down page loading time. Instead, by disabling Google Fonts in WordPress, your site can load faster, even in areas with poor internet connection.  

Therefore, using up to two fonts across your website is generally recommended. This helps to maintain consistency and readability and improve website performance. Alternatively, you can disable Google fonts and opt for system fonts to enhance the speed of your website.  

Privacy and GDPR Compliance:  

Google Fonts pulls resources from external Google servers. These requests reveal visitors’ data, such as IP addresses, which may not comply with specific regulations. So, disabling Google fonts helps to minimize the risk of your site violating any international law.  

For instance, using Google Fonts in European countries can violate GDPR complaints. Under the GDPR, websites must protect their visitor’s personal information, but Google Fonts, which are loaded from external servers, can collect user information such as IP address. If done without the user’s consent, it could violate GDPR, leading to potential fines.  

Considering the after-effects, the European Data Protection Authority (EDPS) website removed Google Fonts to comply with GDPR and, in doing so, decreased the number of external requests. This change resulted in faster page loading and ensured the site complied with European privacy laws, benefiting performance and legal standing. 

Consistency:

When you use external fonts, there is always a possibility that they may load incorrectly for some users. This can affect your site’s appearance and bounce rate. However, disabling Google Fonts ensures a faster and more consistent design for all users worldwide. 

Having said that, let’s explore a few ways to disable Google Fonts on your WordPress site:

Disable Google Fonts in WordPress-using a plugin   

 Many plugins in WordPress help you to disable Google Fonts in a very simple way. Let’s dive into a few of them below- 

1. Using “Disable and remove Google Fonts“Plugin  

As the name suggests, this plugin is designed specifically to disable Google Fonts. After installation, it works automatically in the background to ensure that Google Fonts no longer load on your site.  

Here’s how to install and use the plugin: 

Step 1: Go to Plugins > Add New in your WordPress dashboard. 

Step 2: Search for “Disable and Remove Google Fonts”. Install and activate the plugin.

Step 3: Once activated, the plugin works automatically and disables Google Fonts without additional configuration. 

Upon activation, the plugin automatically removes any external requests to load Google Fonts from your WordPress site. If your theme or website relies heavily on Google Fonts, your site typography would be reverted to system fonts, which could slightly alter the font’s Appearance. Therefore, check the design upon activation to see if it meets your standards.  

Overall, the plugin offers a quick and easy way to remove Google Fonts from WordPress without coding or complex settings.  

2. Autoptimize  

Autoptimize is a powerful performance optimization plugin whose highlight feature is disabling Google Fonts.  Here’s how you can use the Autoptimize plugin to disable Google Fonts: 

Step 1: Install and Activate Autoptimize from your WordPress dashboard  

Step 2: Configure Autoptimize to disable Google Fonts. Upon activation, go to Settings > Autoptimize.

Step 3: Under the Extra option section, look for the Remove Google Fonts setting. Check the box next to Remove Google Fonts to disable Google Fonts from loading on your site.

Once configured, you can save the changes and empty the cache to apply the new settings. Test your website to ensure its typography and design are compliant with your standards.  

In short, Autoptimize provides an easy, user-friendly way to disable Google Fonts while helping your site load faster and become more privacy compliant. 

 3. Perfmatters   

Like Autoptimize, Perfmatters is another WordPress performance optimization plugin that helps to disable Google Fonts in WordPress.

Here’s how to disable Google Fonts using Perfmatters: 

Step 1: Install and activate Perfmatters 

Step 2: After activation, go to Settings > Perfmatters.

Step 3: Navigate to the Fonts tab. Scroll until you find the Google Fonts section.

Step 4: Toggle the switch to Disable Google Fonts. This will stop Google Fonts from being loaded on your website. 

Finally, save the changes and clear the cache to ensure the changes take effect. In summary, Perfmatters provides an efficient way to disable Google Fonts with minimal effort while improving your website’s speed and privacy. 

4. FlyingPress  

FlyingPress is a premium WordPress plugin that offers a suite of performance optimization features, including disabling Google Fonts.  

Here’s how to disable Google Fonts using FlyingPress: 

Step 1: Install and activate FlyingPress: Purchase, install and activate the plugin. 

Step 2: Go to Settings: Go to FlyingPress > Settings in your WordPress dashboard. 

Step 3: In the Bloat tab, toggle the option to Disable Google Fonts. 

Save the changes and remove the cache to ensure the changes take place immediately.  

5.WP Rocket  

WP Rocket is another performance optimization tool and one of its features is optimizing Google Fonts.  

 Here’s how to optimize Google Fonts using WP Rocket: 

Step 1: Install and activate WP Rocket: Purchase, install and activate WP Rocket from the official website. 

Step 2: Disable Google Fonts: In the file optimization tab, scroll to the CSS files section and check on the Remove Google Fonts box. 

Step 3: Save Changes and clear your cache. 

WP Rocket simplifies removing Google Fonts, making it an ideal choice for anyone looking to improve their website’s performance and privacy with minimal effort. 

Disable Google Fonts in WordPress without a plugin  

 If you don’t prefer to use a plugin, you can manually remove Google Fonts on your WordPress website. This can be done either from your WordPress theme settings or by using a child theme.  

1. Disable Google Fonts via theme settings  

Many WordPress themes come with built-in options to automatically disable Google Fonts without the need for plugins or additional codes.  

Here’s how you can disable Google Fonts from your WordPress themes: 

• Go to Appearance> Customize in your WordPress dashboard. 

• Navigate to the Typography or Fonts section. 

• Switch font options from Google Fonts to system fonts (like Arial, Helvetica, or Georgia). 

• Save and publish your changes. 
• Clear your cache and test the site to ensure the changes are applied and Google Fonts is no longer loading. 

If your theme doesn’t allow disabling Google Fonts, you might need to use a plugin or custom code in your theme’s functions.php file to stop loading them. 

2. Disable Google font using child theme options – system fonts   

 To disable Google Fonts using a child theme: 

• Create a Child Theme if you still need to do so. Alternatively, go to Appearance>Theme File Editor to reach the child folder. 

• Add a functions.php and style.css file in the child theme folder. 

• Add Code to Disable Google Fonts: In the functions.php file, add: 

function remove_google_fonts() {
    wp_dequeue_style('your-theme-google-fonts'); 
    wp_deregister_style('your-theme-google-fonts'); 
}
add_action('wp_enqueue_scripts', 'remove_google_fonts', 20);

• Replace 'your-theme-google-fonts' with the specific handle for your theme’s Google Fonts if needed.
• Replace with System Fonts: After disabling Google Fonts, ensure your theme uses system or local fonts. You can define them in your style.css file of the child theme. This method will remove Google Fonts from your theme and replace them with faster-loading system fonts.

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

4. Test: Check your website to ensure Google Fonts are no longer loading. 

How to self-host Google Fonts on your own server  

Self-hosting Google Fonts means downloading Google fonts and using them from your server directly. There will be no need to send external requests to load the Google fonts here. This gives you more control over your website’s performance and security, as it eliminates dependency on third-party servers.  

You can replace Google Fonts by downloading them and serving them as web-safe fonts directly from your website. Here’s a quick guide: 

• Download Google Fonts: Visit Google Fonts and download the font files (usually .woff or .woff2 formats) to your computer.  
• Upload fonts to your server: Upload the downloaded fonts to your website’s directory. A typical location is /wp-content/uploads/fonts/ or a fonts folder in your theme directory. 

• Integrate Fonts locally: Now that your fonts are uploaded to the fonts folder, you need to link them in your theme’s style.css file.

• Replace YourFontName with the actual name of the font and update the file paths accordingly.

@font-face {
    font-family: "YourFontName";
    src: url("/wp-content/uploads/fonts/YourFontName.woff2") format("woff2"),
         url("/wp-content/uploads/fonts/YourFontName.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

• Now that the font is loaded on your server, you need to apply it to the elements on your website.

body {
    font-family: "YourFontName", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "YourFontName", sans-serif;
}

This setup will help you self-host Google Fonts, improving site performance by eliminating external font requests and giving you full control over font loading on your website.

Disable external Google Fonts: 

Remove or block the Google Fonts being loaded externally by editing your theme’s functions.php file or using a plugin like OMGF

OMGF (Optimize My Google Fonts) plugin 

The OMFG plugin is used to self-host Google Fonts.    

The OMGF (Optimize My Google Fonts) plugin is a popular and straightforward solution to self-host Google Fonts. It scans your site, downloads the fonts and replaces the external requests with locally hosted versions, all without requiring manual intervention.: 

• Install the plugin: Go to Plugins > Add New in your WordPress dashboard and search for OMGF. Install and activate it. 

• Configure the plugin: Go to Settings > Optimize Google Fonts and run the font detection. 

• Self-host fonts: The plugin will download the fonts and start serving them locally automatically. 

Once setup is complete, the plugin ensures that your fonts load faster, improving page speed and avoiding third-party requests to Google’s servers. 

By self-hosting fonts using plugins like OMGF or manually downloading and integrating fonts locally, you gain better control over your site’s performance and privacy while ensuring compliance with regulations like GDPR. 

Testing your site after disabling Google Fonts  

After disabling or replacing Google Fonts, you must test your site for layout consistency and performance improvements. 

Check your website’s typography and spacing to see if they meet your standards. Verify if your fonts and design look correct after removing Google Fonts. In addition, use tools like Google PageSpeed Insights and GTmetrix to check how disabling Google Fonts affects your site’s load times and performance.  

Final thoughts  

Disabling Google Fonts can bring significant benefits, including improved website performance, enhanced privacy and greater control over your design. Whether you choose to disable them entirely or self-host the fonts locally, it’s essential to test different solutions and find the one that best fits your needs. 

FAQs