This post is focused on the solution to Remove Google Fonts from WordPress to make your site faster and more private.
Google Fonts are popular because they have lots of styles and are easy to use. But, they can also make your website slow. If you are a blogger or a website developer, you know that a fast website is very important.
Disabling Google Fonts in WordPress makes your website lean and fast. And, it is good for privacy and follows GDPR rules.
In this guide, you will learn how to safely disable Google Fonts in WordPress without compromising on looks or functionality. Whether you want to do it manually or with plugins like Litespeed or WP Rocket, we will discuss several ways to remove Google fonts from WordPress sites.
I am also going to share a step-by-step process to turn off Google fonts from popular page builders like Elementor, Divi, Visual Composer, and themes like Astra, GeneratePress, Kadence, etc.
But before I share the steps to turn off Google Fonts from WordPress, you must know why would you want to take out Google Fonts from your website.
☲ Table of Contents
- Why Remove Google Fonts from WordPress Site
- How to Remove Google Fonts from WordPress
- Manually Remove Google Fonts from WordPress – Without Plugin
- Disable Google Fonts in WordPress using Plugin
- Remove Google Fonts from Themes and Page Builders
- Stop Loading Google Fonts, Use Alternatives Instead
- Wrapping Up
- FAQs on Remove Google Fonts from WP
Why Remove Google Fonts from WordPress Site
No doubt that Google Fonts look great and give your website a unique and modern look. I also agree that they are easy to use and have many styles, but they come with a few issues. Let’s look at some reasons why you might want to remove or deactivate them from your WordPress site.
- Google Fonts can slow down your website as it requires the site to fetch fonts from another server, impacting loading speed and site load time.
- Using Google Fonts compromises privacy as it shares visitor data with Google, raising concerns for privacy-conscious individuals.
- Google Fonts does not follow GDPR regulations, which are crucial for websites engaging with European visitors, potentially complicating adherence to these regulations.
I also removed Google Fonts from my website a few years ago and started using Web Safe Fonts without compromising the look and feel of my website. Which resulted in fast website loading time and good performance. You can also remove it using the steps below.
How to Remove Google Fonts from WordPress
It is quite easy to turn off Google Fonts loading in WordPress using a plugin. Here’s how.
Steps to Remove Google Fonts from WordPress:
- Install and Activate the “Disable and Remove Google Fonts” plugin.
- The plugin works right away. It automatically stops Google Fonts from loading on your WordPress site.
- And you’re done! Google Fonts should no longer appear on your WordPress site.
Other methods to remove Google Fonts include manual removal or using different WP plugins. Alternatively, instead of removing it, you can optimize Google Fonts loading on WordPress through self-hosting or utilizing a GDPR-compliant CDN like BunnyFonts. Continue reading the article for further information.
Manually Remove Google Fonts from WordPress – Without Plugin
There are various ways to include Google fonts in WordPress. So to remove them manually, we need to identify the correct embedding method and then remove it safely.
1. Dequeue Google Fonts using wp_dequeue_style() Function
You only need a few lines of code in the funcations.php file, if you want to remove Google Fonts manually.
WordPress Functions wp_enqueue_style() is commonly used by themes and plugin developers to embed the Google Fonts in WP themes. This function registers any CSS stylesheet via the provided source and enqueues the same. So, to remove fonts added using this function, we need to dequeue it.
- Identify the embedding method used to include Google Fonts in your WordPress theme.
- Locate the
wp_enqueue_style()function in thefunctions.phpfile of your theme or child theme. - Find the unique
$handleparameter associated with the enqueued CSS stylesheet for Google Fonts. - Add the following code to disable Google Fonts in WordPress:
//* TN Dequeue Styles - Remove Google Fonts from Genesis Sample WordPress Theme
add_action( 'wp_print_styles', 'tn_dequeue_google_fonts_style' );
function tn_dequeue_google_fonts_style() {
wp_dequeue_style( 'genesis-sample-fonts' ); // Replace 'genesis-sample-fonts' with your $handle
}Remember to replace 'genesis-sample-fonts' in the code with the actual $handle of the stylesheet which you want to revise. This code should work with every WordPress theme in which Google Fonts (or any font) are enqueued via the WordPress function.
It is advisable to use a Child theme and a Custom Code snippets plugin for adding this code. And do not forget to back up your site before making any changes to your website code.
2. Deleting Google Fonts Embeds in WordPress: <link> or @import or @font-face
Google Fonts can be directly embedded in your site using <link>, @import, or @font-face methods.
By embedding the fonts url in <link> in the <head> section of HTML i.e.
<link href="https://technumero.com/wp-content/cache/flying-press/149952cdfd27.google-font.css" rel="stylesheet">
By embedding @import in the CSS file or in <head> i.e.
@import url('https://technumero.com/wp-content/cache/flying-press/149952cdfd27.google-font.css');By using @font-face directly in the CSS file i.e.
/* latin-ext */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu7GxKKTU1Kvnz.woff2) format('woff2');
unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu4mxKKTU1Kg.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
} Now, you need to identify and delete Google Fonts embedded in your theme’s CSS file or child theme. Here are the steps:
- Go to “Tools” and click on “Theme File Editor.”
- On the right side, find
style.cssfile, or a similar file in your child theme. - Look for lines of code that include
googleapis.comorfonts.gstatic.com. - Carefully remove these lines. Save the changes.
Remember, this might not work for every theme or site. Some themes include Google Fonts in different ways. If you cannot find the code, or if you are not sure, it is better to use a plugin to turn off Google Fonts in WordPress.
<head> section to set the default body font as the system font. /* System font as the default body font */
<style>
body{
font-family:-apple-system,system-ui,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Fira Sans','Droid Sans','Helvetica Neue',sans-serif !important}code{font-family:Menlo,Consolas,Monaco,Liberation Mono,Lucida Console,monospace !important
}
</style>Here is a cheat sheet I have compiled to identify the Google Font Stylesheet $handle of popular WordPress Themes.
3. Cheat Sheet to identify Google Font Stylesheet name or $handle of Popular WordPress Themes
| Theme | Google Fonts Stylesheet Name / $handle |
| Twenty Twelve | twentytwelve-fonts |
| Twenty Thirteen | twentythirteen-fonts |
| Twenty Fourteen | twentyfourteen-fonts |
| Twenty Fifteen | twentyfifteen-fonts |
| Twenty Sixteen | twentysixteen-fonts |
| Twenty Seventeen | twentyseventeen-fonts |
| Genesis Sample | genesis-sample-fonts |
| Extra | extra-fonts |
| Divi | divi-fonts |
Disable Google Fonts in WordPress using Plugin
If you are not comfortable with code, it is quite easy to disable Google Fonts using a plugin. There are several plugins you could use to deactivate Google Fonts. Here is how to use some popular free and paid plugins to remove Google fonts.
# Disable Google Fonts using LiteSpeed Cache
LiteSpeed Cache, this free plugin is not just for caching; it can also help with font optimization. The Litespeed Cache plugin offers a simple toggle to disable Google Fonts:
- Install and activate “LiteSpeed Cache” plugin.
- Go to the “Page Optimization” settings page, and under the “HTML Settings” tab, find the option to Remove Google Fonts.
- Turn it “ON” and save your changes. That’s it!
# Disable Google Fonts using Autoptimize Plugin
Autoptimize is a popular Free WordPress Speed Optimization plugin, that also has a handy option to remove Google Fonts.
- Install and activate “Autoptimize” from the WP plugin directory.
- Navigate to the Autoptimize Settings page and Go to the “Extra” Tab.
- Select the “Remove Google Fonts” option on the Extra Auto-Optimizations page.
- Save the changes and that’s it!
# Disable and Remove Google Fonts Plugin
Disable and Remove Google Fonts: Another free plugin that does exactly what its name suggests.
- Install and activate it from the WordPress plugin directory.
- Once activated, it works automatically. There is no settings page.
Now, you can also try paid plugins to disable Google Fonts in WordPress. I use the Perfmatters plugin to remove Google Fonts.
# Disable Google Fonts using Perfmatters
Perfmatters is a lightweight plugin that improves website performance. It offers a more comprehensive optimization toolkit.
- After installation, go to the “Perfmatters” settings page.
- Navigate to the “Fonts” tab.
- Look for the “Disable Google Fonts” option and turn it “NO”.
- Save changes and done!
# Disable Google Fonts using FlyingPress
FlyingPress is the best WordPress Speed Optimization plugin today. To remove the Google Fonts using FlyingPress:
- Install and go to the settings page of “FlyingPress” plugin.
- Navigate to the “Bloat” section.
- Check the option to “Remove Google Fonts”.
- Save Changes and you are done!
# Disable Google Fonts using WP Rocket
Always save your settings after making changes and make sure you have a backup before you start using any new plugin.
Remove Google Fonts from Themes and Page Builders
Different WordPress themes and page builders have their own ways to include and remove Google Fonts. Here is how you can disable them in some popular ones.
# Elementor – Disable Google Fonts
- Go to Elementor Settings.
- Click on the “Advanced Tab” and find the “Google Fonts” option.
- Select “Disable” in the dropdown to remove Google Fonts.
- Now, System font will be used by default instead of Google Fonts.
Alternatively, add the following code to completely disable Google Fonts in Elementor:
// Disable Google Fonts in Elementor
add_filter( 'elementor/frontend/print_google_fonts', '__return_false' );# Divi – Disable Google Fonts
- Go to the Divi Theme Options.
- Under the General Settings tab, find the option “Use Google Fonts”.
- Make sure it is “Disabled” to disable Google Fonts.
If you want, you can use this code to remove all Google Fonts from Divi Theme and Builder.
// Divi - Remove Google Fonts
add_action( 'wp_enqueue_scripts', 'tn_dequeue_divi_fonts_style', 20 );
function tn_dequeue_divi_fonts_style() {
wp_dequeue_style( 'divi-fonts' );
wp_dequeue_style('et-builder-googlefonts');
wp_dequeue_style('et-builder-googlefonts-cached');
}# GeneratePress – Disable Google Fonts
In GeneratePress, you can stop using Google Fonts from Customizer.
- Go to Customizer > Typography > Font Manager.
- Then select System Stack instead of Google Fonts.
Use this PHP code to fully remove Google fonts from GeneratePress:
// GeneratePress - Remove Google Fonts
add_action( 'wp_enqueue_scripts', function() {
wp_dequeue_style( 'generate-fonts' );
} );
// GeneratePress - Disable Google Fonts in Theme Customizer
add_action( 'admin_init', function() {
add_filter( 'generate_google_fonts_array', '__return_empty_array' );
} );# Astra – Disable Google Fonts
- Astra allows you to disable Google Fonts from its customizer.
- Head to Appearance > Customize.
- Go to Typography and select a different font type or upload a custom font.
To remove Google Fonts from Astra, add this filter:
// Astra - Disable Google Fonts
add_filter( 'astra_google_fonts', '__return_empty_array' );If interested, you can self-host and load Google Fonts locally with Astra Pro.
# Kadence – Disable Google Fonts
- With Kadence, go to Appearance > Customize.
- Navigate to General > Typography.
- Choose a standard font or upload your own to replace Google Fonts.
Instead, use the following code to disable Google Fonts from Kadence
// Kadence - Disable Google Fonts
add_filter( 'kadence_print_google_fonts', '__return_false' );You can host and serve Google Fonts from your server with the Kadence Custom Fonts feature comes with the paid version of Kadence Pro.
# Blocksy – Disable Google Fonts
- In Blocksy, access the Customizer from your WordPress dashboard.
- Find Typography settings and opt for a different font or upload a custom font.
Use the following snippet to completely remove Google Fonts from Blocksy theme:
// Blocksy - Remove Google Fonts
add_filter('blocksy:typography:google:use-remote', function () {
return false;
});
add_filter('blocksy_typography_font_sources', function ($sources) {
unset($sources['google']);
return $sources;
});Blocksy theme also offers the option to locally host Google Fonts with their premium version.
Each theme or builder might update their interface, so if these steps do not work, check their support or documentation for help to deactivate Google Fonts from WordPress themes. Remember, it is always good to test changes on a staging site before applying them to your live site. Next, we will explore how to replace Google Fonts with local fonts.
Stop Loading Google Fonts, Use Alternatives Instead
It is true that removing Google Fonts will slightly change the look and feel of your site. But if you do not want that, then I would suggest you use fonts without loading them from Google. There are a couple of popular ways to replace Google Fonts.
You can load fonts from your server, or use GDPR-compliant free third-party Fonts like BunnyFonts and Cloudflare Fonts to optimize font loading as a Google Fonts alternative.
# Self-Hosting Google Fonts
Self-hosting fonts means keeping font files on your own server. It will help you follow GDPR compliances and can make your site faster by caching fonts locally. Here is a simple guide to self-host your fonts in WordPress:
- First, remove the existing Google Fonts embed.
- Identify and Download the font files (in .woff and .woff2 formats) that you want to self-host from Google Fonts or somewhere else.
- Upload the font files to your WP site using FTP. You can put them in a folder like
/wp-content/fonts/. - Add the following CSS code in the
style.cssfile to use the local fonts.
For example, your CSS might look like this for the Roboto font:
/* Self hosted Google Fonts */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url('/wp-contnet/fonts/roboto.woff2)format('woff2');
src: url('/wp-contnet/fonts/roboto.woff)format('woff');
}
body {
font-family: 'Roboto', sans-serif;
}You can also add the code in <head> using any snippets plugin. You can also use plugins to self-host Google fonts in WordPress, such as Local Google Fonts, OMGF | Host Google Fonts Locally. and EasyFonts.
# Replacing Google Fonts with Local Fonts or Web Safe Fonts
Instead of relying on Google Fonts, you can use Web Safe Fonts or system fonts that are readily available on the device. A few popular Web Safe Fonts include Arial, Helvetica, and Times New Roman. Here is the complete list of Web Safe Fonts.
Add the following code in the <head> section to specify Web Safe Fonts in your theme.
<style>
body {
font-family: Arial, sans-serif;
}
</style>Wrapping Up
When it comes to optimizing your WordPress site, removing Google fonts can be a game-changer. You can follow any method to remove Google fonts from WordPress.
In my opinion, you should use the Perfmatters plugin to safely remove the Google font from WordPress or turn it off using the built-in option of your theme.
Further, I do not recommend shared web hosting users to use Google Fonts on their websites at all. Not even local or self-hosted fonts, as it impacts your website speed badly and results in poor user experience.
Remember, a fast-loading site can keep visitors happy and coming back. Plus, taking care of privacy shows you value your visitors.
What fonts do you use, Google Fonts or Web Safe Fonts? Does using Google Fonts impact your website performance? Which method you will use to disable Google Fonts on your website?
Let us know if you are finding it difficult to Remove Google Fonts from any other WordPress theme.
FAQs on Remove Google Fonts from WP
Will my website look bad without Google Fonts?
The answer is no. You can use several beautiful fonts that do not slow down your website. With web-safe fonts, you can keep your site looking great.
What happens when I disable Google Fonts?
When you disable them, your website will stop loading font files from Google servers. This will make your website load faster because of reduced page size and fewer requests.
How to Remove Google Fonts without Compromising the Look
After removing the Google Fonts with or without a plugin. Always set the “System fonts” as the “default <body> font” in the <head> section to avoid ugly typography. Read the article for how to set the default body font.
You might like:
Thank you so much – easy & perfect solution!
Best regards
Heike
Hi, at my Divi Child Theme this did not work.
Hi Joerg,
Thank you for pointing out. You should use the correct stylesheet $handle to remove google fonts from Divi theme. In the latest version of Divi theme, they changed the stylesheet $handle.
Try using
divi-fonts-cssinstead ofdivi-fonts. It will work.Is is possible to remove Google fonts from Elemin theme of Themify family. Please let me know.
Thanks
Yes. Just try to use the right $handle.
I have build a divi child theme and add to functions.php the script:
//* TN Dequeue Styles – Remove Google Fonts from Divi Theme
add_action( ‘wp_print_styles’, ‘tn_dequeue_divi_fonts_style’ );
add_action( ‘wp_enqueue_scripts’, ‘tn_dequeue_divi_fonts_style’ );
function tn_dequeue_divi_fonts_style() {
wp_dequeue_style( ‘divi-fonts-css’ );
wp_dequeue_style( ‘divi-fonts’ );
}
but it will not working with divi-fonts-css or divi-fonts. My Divi version is 3.0.5
In that case, you have to use the web safe font from the customize panel and then use this code to remove google font.
Hi! I am using the Accesspress parallax pro Themen and IT doesn’t work. :(( Do you have an Idea?
You should have use this (google-fonts-css) $handle to make it work.
any idea what font handle does bridge theme uses?
use the plugin, if you are not able to identify the $handle
Good evening, I write from Spain the article is very interesting, and I was wondering if you can help me … my topic is Salient, what function do I have to place in the file functions.php
Greetings and I’m waiting.
if ( ! function_exists( ‘hoffman_load_style’ ) ) {
function hoffman_load_style() {
if ( ! is_admin() ) {
wp_register_style( ‘hoffman_googleFonts’, ‘//fonts.googleapis.com/css?family=Raleway:400,600,700,800|Vollkorn:400,400italic,700,700italic’ );
wp_register_style( ‘hoffman_genericons’, get_template_directory_uri() . ‘/genericons/genericons.css’ );
wp_enqueue_style( ‘hoffman_style’, get_stylesheet_uri(), array( ‘hoffman_googleFonts’, ‘hoffman_genericons’ ) );
}
}
add_action( ‘wp_print_styles’, ‘hoffman_load_style’ );
what do i do to stop calling google fonts without losing all other formatting?
You can comment out the Goggle fonts line from your code.
/* wp_register_style( ‘hoffman_googleFonts’, ‘//fonts.googleapis.com/css?family=Raleway:400,600,700,800|Vollkorn:400,400italic,700,700italic’ ); */This should work.
Hey there great post, do you happen to know what the $handle is for the AVADA theme? I’m thinking it may be Avada_Fonts or Avada_gfonts??
Thanks for your help.
Hi, The default font of AVADA theme is museo-slab and PT-sans. museo-slab is not a Google font so, these fonts should have to removed/changed from the style.css/function.php file. If you are not comfortable in editing theme files Try using the plugin to remove google font.
Cheers!
Interesante. Gracias.
Hey,
It doesn’t work for me. I have Wealth theme.
I added this :
add_action( ‘wp_print_styles’, ‘tn_dequeue_google_fonts_style’ );
function tn_dequeue_google_fonts_style() {
wp_dequeue_style( ‘wealth-fonts’ );
}
and when I open my site, it seems like it works for some milliseconds and then some scripts allow the google fonts again :O
Hey Seb,
Thank you for the response. After removing the font, test your site in an incognito window, it should work.
Otherwise, you must remove the code from the theme file, or use the plugin.
thank you so much. finally a solution that worked, after trying for hours! thanks!!
Does not work on AccessPress Lite.
Hey Danil, I am not sure which
$handleyou are using to remove the google font. However, to make it work with AccessPress Lite, you should useaccesspresslite-google-fontsMy website using Xmag Them, but I don’t find the theme Google fonts. Please help me! Thanks
In that case, you should use a plugin to remove google font.
hi!
My website used xmag theme. And I have removed Google fonts by code:
/* TN Dequeue Styles – Remove Google Fonts from Xmag Theme
add_action( ‘wp_print_styles’, ‘tn_dequeue_xmag_fonts_style’ );
function tn_dequeue_xmag_fonts_style() {
wp_dequeue_style( ‘xmag-fonts’ );
}
When I use PageSpeed Insights check, the google fonts still load.
Please help me!
It should work if you are using the
$handelright? Otherwise, you should use a plugin.Thanks for your post, Saurabh. You are right: G. fonts can impact the performance of our websites pretty badly, and not only on shared hosting…
I have a (probably stupid 🙂 ) question, though: why not delete or comment out the wp_enqueue_style() in functions.php and replace the font(s) in the stylesheet? I don’t understand this enqueue then dequeue process.
That’s what I’ve done with Genesis Sample and it’s working just fine, unless I’m missing something…
Hey, there is no harm in deleting and commenting out the wp_enqueue_style() from your theme. It will work fine.
The dequeuing function works, when you did not (wanted to) know/or unable to found font enqueue function in your theme. ?
😀 😀 😀
Anyone who cannot find and comment out this piece of code is unable to understand your post. (which doesn’t mean (s)he is stupid, don’t get me wrong)
google analytics and google fonts fu**ked my site speed
very thanks for this help
Hi, I have an doubt that, removing of google fonts will not affect our front-end pages right?
Hi Lavanya,
Removing the google font may affect the front end of your website. It totally depends on the avilability of the fallback fonts.
Really an amazing article. However, I’m using oceanWP theme. There is a option in customize>typography>general to disable the Google font. I disabled it and it looks ugly now. Is there any way to remove Google font without compromising the look in oceanWP theme?