Why it matters
Third-party font CSS is render-blocking and adds connection time on mobile. Hosting fonts on your own domain is faster and avoids sending visitor IPs to Google (a GDPR concern in the EU).
How to fix it in WordPress
- Install a plugin like 'OMGF (Optimize My Google Fonts)' or use your performance plugin's local fonts option.
- Let it download the fonts to your server and rewrite the font CSS.
- Remove font weights and styles you don't use (most sites only need 2–3).
- Clear your page cache.
Plugin-specific steps
Already using one of these plugins? Follow the exact steps for your setup.
Perfmatters
- 1Go to Settings → Perfmatters → Fonts.
- 2Toggle on 'Local Google Fonts'.
- 3Toggle on 'Display Swap'.
- 4Optionally set 'Limit Subsets' to Latin if your site is in English/Spanish.
- 5Save and clear your cache.
WP Rocket
- 1Go to Settings → WP Rocket → Media.
- 2Under Fonts, enable 'Self-host Google Fonts' (WP Rocket 3.18+).
- 3Save changes and clear the cache.
LiteSpeed Cache
- 1Go to LiteSpeed Cache → Page Optimization → HTML Settings.
- 2Turn on 'Load Google Fonts Asynchronously' — or turn on 'Remove Google Fonts' if you host fonts locally with another plugin.
- 3Save and purge all caches.
Autoptimize
- 1Go to Settings → Autoptimize → Extra.
- 2Under 'Google Fonts', choose 'Combine and preload in head (fonts load asynchronously)'.
- 3Save changes and empty the cache.
Elementor
- 1Go to Elementor → Settings → Performance (or Advanced on older versions).
- 2Set 'Load Google Fonts Locally' to Enable.
- 3Set 'Google Fonts Load' to Swap.
- 4Regenerate CSS & data under Elementor → Tools and clear your cache.
How to verify the fix
- Reload the page with DevTools → Network open and filter by 'fonts.g' — nothing should appear.
- Check headings and body text still use the right font.
