Fix Missing Google Fonts After Elementor Domain Change (2025 Guide)

Changed your site domain (or moved staging → live) and suddenly your Google Fonts disappeared in Elementor? This guide gives you quick checks and permanent fixes—so your typography looks right, fast.

Symptoms

• Body/heading fonts fall back to default (e.g., Arial).
• In DevTools Network, fonts.gstatic.com or fonts.googleapis.com requests are blocked/404/mixed-content.
• Elementor shows the right family names, but front-end doesn’t apply them.

Quick Fix (5-minute checklist)

1. Regenerate CSS & Data (Elementor → Tools → Regenerate CSS & Data).
2. Clear all caches (plugin cache, server cache, CDN, browser hard refresh).
3. Update Site URL (WP Admin → Settings → General: WordPress Address & Site Address).
4. Replace old domain strings (page builder CSS, widgets, custom CSS, DB).
5. Ensure HTTPS for all font requests (no mixed content).

Step-by-Step Fixes

1) Update Elementor’s generated files

1. Elementor → Tools → Regenerate CSS & Data.
2. Elementor → Settings → Advanced:
   • CSS Print Method: try External File (preferred). If issues persist, test Internal Embedding.
   • Load Google Fonts: keep Yes if you use Google Fonts. (If you’ll host fonts locally, set to No.)
3. Clear any caching plugin, server cache, and CDN cache.

2) Fix old URLs after a domain change

If you moved old-domain.com → new-domain.com, Elementor’s CSS or serialized options may still reference the old domain.

# Run from your WP root
wp search-replace 'http://old-domain.com' 'https://new-domain.com' --all-tables --precise --report
wp search-replace 'https://old-domain.com' 'https://new-domain.com' --all-tables --precise --report

3) Eliminate mixed content (force HTTPS)

Ensure your Google Fonts links are HTTPS and add &display=swap for better rendering:

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap" rel="stylesheet">

If your site recently enabled SSL, update any hard-coded http:// font URLs in theme/header code or custom HTML widgets.

4) Check CORS for self-hosted font files

If you decided to host fonts locally and serve .woff2 files from your domain or CDN, allow cross-origin font loading.

# Allow web fonts cross-origin
<FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>

5) Consider hosting Google Fonts locally (performance & control)

Pros: no external calls, stable after domain changes, easier caching. Cons: you must update files when families/weights change.

1. Download required families/weights (e.g., via Google Webfonts Helper).
2. Upload to /wp-content/uploads/fonts/ (or a theme asset folder).
3. Enqueue a local stylesheet and reference the fonts in CSS.
4. In Elementor → Settings, set Load Google Fonts to No to prevent duplicate loads.

Troubleshooting with DevTools

• Network: filter by “font”. Look for 404/403, blocked by CORS, or cached old-domain URLs.
• Console: check mixed content warnings, CSP blocks, or ad/script blockers interfering with fonts.
• Disable cache (while DevTools is open) and hard reload to test fresh requests.

Performance Tips

• Use only the weights/styles you actually need (e.g., 400/600) to reduce requests.
• Preconnect to Google Fonts domains (see snippet above).
• Add font-display: swap; (already enabled with &display=swap) for faster first paint.

FAQ

Q. Does changing a domain break Google Fonts in Elementor?
A. It can, if old URLs remain in generated CSS or if HTTPS/CORS isn’t configured. Replace old domains, regenerate CSS, and clear caches.

Q. I fixed URLs but fonts still don’t render.
A. Check caching/CDN, verify no mixed content, and ensure you didn’t disable Google Fonts in Elementor while still referencing them.

Q. Local vs Google CDN—what should I choose?
A. For maximum control and fewer external calls, host locally. For simplicity and automatic updates, keep Google CDN. Both are valid—pick one and avoid duplicates.

Need help migrating Elementor sites or cleaning up post-migration font issues? Get expert help: Contact We Design Orange →