Fehlende Google Fonts nach Domainwechsel in Elementor beheben (Leitfaden 2025)

Domain geändert (oder von Staging auf Live umgezogen) und plötzlich sind die Google Fonts in Elementor weg? Diese Anleitung liefert schnelle Checks und dauerhafte Fixes – damit deine Typografie schnell wieder stimmt.

Symptome

• Body-/Heading-Schriften fallen auf Standard zurück (z. B. Arial).
• In DevTools Network sind Anfragen an fonts.gstatic.com oder fonts.googleapis.com blockiert/404/mixed-content.
• Elementor zeigt die richtigen Familien an, aber im Frontend werden sie nicht angewendet.

Schnellfix (5-Minuten-Checkliste)

1. Regenerate CSS & Data (Elementor → Tools → Regenerate CSS & Data).
2. Alle Caches leeren (Plugin, Server, CDN, Browser-Hard-Reload).
3. Site-URL aktualisieren (WP Admin → Settings → General: WordPress Address & Site Address).
4. Alte Domainstrings ersetzen (Builder-CSS, Widgets, Custom CSS, DB).
5. HTTPS sicherstellen für alle Font-Requests (kein Mixed Content).

Step-by-Step-Fixes

1) Von Elementor generierte Dateien aktualisieren

1. Elementor → Tools → Regenerate CSS & Data.
2. Elementor → Settings → Advanced:
   • CSS Print Method: External File bevorzugt; sonst Internal Embedding testen.
   • Load Google Fonts: Yes, wenn du Google Fonts nutzt. (Bei lokalem Hosting → No.)
3. Plugin/Server/CDN-Cache leeren.

2) Alte URLs nach Domainwechsel korrigieren

Bei Umzug old-domain.com → new-domain.com können Elementor-CSS oder serialisierte Optionen noch auf die alte Domain verweisen.

# Im WP-Root ausführen
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) Mixed Content eliminieren (HTTPS erzwingen)

Sorge für HTTPS-Links zu Google Fonts und füge &display=swap für besseres Rendering hinzu:

<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">

Nach neuer SSL-Aktivierung aktualisiere fest verdrahtete http://-Font-URLs im Theme/Widgets.

4) CORS für lokal gehostete Fonts prüfen

Wenn du Fonts lokal hostest und .woff2 von deiner Domain/CDN lieferst, erlaube Cross-Origin-Laden.

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

5) Google Fonts lokal hosten erwägen (Performance & Kontrolle)

Pro: keine externen Calls, stabil nach Domainwechsel, Cache einfacher. Contra: Dateien bei Familien/Gewichten manuell aktualisieren.

1. Benötigte Familien/Gewichte laden (z. B. Google Webfonts Helper).
2. Nach /wp-content/uploads/fonts/ (oder Theme-Assets) hochladen.
3. Lokales Stylesheet einbinden und Fonts im CSS referenzieren.
4. In Elementor → Settings Load Google Fonts auf No setzen, um Doppelladen zu vermeiden.

Fehlersuche mit DevTools

• Network: nach „font“ filtern; 404/403, CORS-Block, alte Domain-URLs im Cache.
• Console: Mixed-Content-Warnungen, CSP-Blocks, Blocker.
• Disable cache (bei geöffneten DevTools) und Hard Reload.

Performance-Tipps

• Nur benötigte Gewichte/Styles laden (z. B. 400/600).
• Preconnect zu Google-Fonts-Domains.
• font-display: swap; einsetzen (mit &display=swap).

FAQ

F. Bricht ein Domainwechsel Google Fonts in Elementor?
A. Kann passieren, wenn alte URLs im generierten CSS verbleiben oder HTTPS/CORS falsch ist. Domains ersetzen, CSS regenerieren, Caches leeren.

F. URLs korrigiert, Fonts rendern dennoch nicht.
A. Cache/CDN, Mixed Content prüfen und sicherstellen, dass Google Fonts nicht deaktiviert sind.

F. Lokal vs. Google-CDN?
A. Lokal = Kontrolle; CDN = Einfachheit. Doppelte Ladungen vermeiden.

Hilfe bei Elementor-Migrationen oder Font-Problemen nötig? Expertenhilfe: Contact We Design Orange →