How to Host Google Fonts Locally in WordPress (The Clean Way)

When your theme doesn’t offer a built-in option to host fonts locally, you’ll eventually face the GDPR question: “Where do my fonts really come from?”. If the answer is Google’s servers, you’re leaking user data before consent is given — and that’s a problem in the EU.

This short checklist shows how to take full control, keep your pages compliant, and maybe even shave off a few milliseconds in load time.

1. Check if your theme already supports local fonts

Many modern themes (like Astra, Kadence, or GeneratePress) have a “Load Google Fonts locally” toggle.
If you’re using something else, like OceanWP or a custom child theme, you’ll likely need to do this manually.

2. Download your fonts

1. Go to fonts.google.com
2. Download the families you need as .ttf
3. Convert them to .woff2 (smaller and GDPR-safe) via transfonter.org

Recommended settings:

• Format: WOFF2
• Subset: latin + latin-ext
• Font-display: swap

3. Place them in your theme

Create this structure inside your child theme:

/wp-content/themes/your-child-theme/assets/fonts/
/wp-content/themes/your-child-theme/assets/css/fonts.css

Each font family in its own folder, for example:

fonts/
  Inter/
  Montserrat/
  Roboto/

4. Create your fonts.css

Example block for each font weight/style:

@font-face {
  font-family: 'Inter';
  src: url('../fonts/Inter/Inter-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: 'Inter', system-ui, -apple-system, Arial, sans-serif;
}

5. Enqueue your local font stylesheet

Add this to your child theme’s functions.php:

add_action('wp_enqueue_scripts', function () {
    wp_enqueue_style(
        'local-fonts',
        get_stylesheet_directory_uri() . '/assets/css/fonts.css',
        [],
        '1.0'
    );
}, 5);

6. Remove external Google Fonts

Block any enqueued stylesheets that call fonts.googleapis.com:

add_action('wp_print_styles', function () {
    global $wp_styles;
    foreach ($wp_styles->queue as $handle) {
        $src = $wp_styles->registered[$handle]->src ?? '';
        if (strpos($src, 'fonts.googleapis.com') !== false) {
            wp_dequeue_style($handle);
            wp_deregister_style($handle);
        }
    }
}, 100);

If you’re using Google Site Kit, also add:

add_filter('googlesitekit_use_google_fonts', '__return_false');

7. Preload key font files (optional)

Add a preload snippet for your most used variants:

add_action('wp_head', function () { ?>
  <link rel="preload" href="<?php echo esc_url( get_stylesheet_directory_uri() . '/assets/fonts/Inter/Inter-Regular.woff2'); ?>" as="font" type="font/woff2" crossorigin>
<?php }, 1);

8. Verify

1. Open DevTools → Network
2. Filter googleapis → 0 results expected
3. Fonts should load directly from your domain.

Takeaway

Hosting fonts locally is a one-time job that gives you:

• Full GDPR compliance
• Faster page loads
• One less external dependency

It’s a small fix with a big impact — especially for sites running OceanWP, Elementor, or any stack that silently pulls fonts from Google.

Note for OceanWP Users

OceanWP does include a setting called “Load Google Fonts locally” under Customizer → Typography → General.
However, this feature only applies to fonts selected directly via the Customizer.

If your site uses a child theme, custom enqueue rules, or plugins that load additional fonts (such as Elementor, Smart Slider, or Google Site Kit), those fonts will still be fetched from Google’s servers — even with the toggle active.

In other words: the switch doesn’t always propagate through every layer of WordPress.
If you rely on a child theme or custom setup, it’s safer to handle local fonts manually as shown above.

Once done, your setup will be truly independent, GDPR-compliant, and update-proof — no surprises when the next OceanWP update lands.

---

Written by Sebaf IT – helping you keep your WordPress lean, compliant, and under control.