GeneratePress: Lokal installierte Google Fonts erscheinen nicht in der Auswahl

Du hast eine Google-Schrift lokal auf deiner WordPress-Seite installiert, aber in GeneratePress oder GenerateBlocks taucht sie im Auswahlfeld nicht auf. Genau dieses Problem war Thema des ursprünglichen Gemini-Chats. Die entscheidende Erkenntnis ist: „Font lokal installiert“ und „Font erscheint automatisch in jedem Dropdown“ sind zwei verschiedene Dinge.

GeneratePress, GenerateBlocks und WordPress können Schriften auf unterschiedliche Weise verwalten. Deshalb solltest du zuerst prüfen, wie die Schrift eingebunden wurde und welchen Namen sie tatsächlich als CSS-Font-Family besitzt.

1. Was bedeutet „lokal installiert“?

Bei einer Website kann „lokal“ mindestens drei Dinge bedeuten:

  • Die Font-Dateien wurden manuell in Theme/Child-Theme hochgeladen und per @font-face registriert.
  • GeneratePress oder ein Font-Plugin hat die Dateien lokal eingebunden.
  • Ein Plugin lädt eine ursprünglich von Google Fonts stammende Schrift lokal vom eigenen Server.

In allen Fällen kann die Schrift technisch bereits funktionieren, ohne automatisch im GenerateBlocks-Dropdown aufzutauchen.

2. Prüfen, ob die Schrift wirklich geladen wird

Bevor du an GeneratePress oder GenerateBlocks suchst, kontrolliere im Browser, ob die Font-Dateien überhaupt geladen werden.

Öffne die Entwicklerwerkzeuge und prüfe:

  • Network/Netzwerk → Filter „font“
  • ob WOFF2-/WOFF-Dateien geladen werden
  • ob Fehler 404 oder CORS auftreten
  • unter „Computed“, welche font-family tatsächlich angewendet wird

Wenn die Datei gar nicht geladen wird, ist das kein Dropdown-Problem, sondern ein Einbindungsproblem.

3. Der Font-Family-Name muss exakt stimmen

Ein häufiger Fehler ist, dass die Schriftdatei einen Dateinamen wie inter-light.woff2 besitzt, der CSS-Familienname aber einfach Inter lautet.

Beispiel:

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

Dann musst du im CSS beziehungsweise in einem freien Font-Family-Feld Inter verwenden – nicht „inter-regular“ oder den Dateinamen.

4. GenerateBlocks erlaubt auch freie Font-Namen

Die aktuelle GenerateBlocks-Dokumentation bestätigt einen wichtigen Punkt: Das Font-Family-Dropdown ist nur eine Abkürzung für eine Auswahl häufiger Schriften. Wenn deine Schrift nicht in der Liste steht, kannst du den Namen im Feld Enter font name selbst eingeben.

Wenn eine lokal gehostete Google-Schrift verwendet wird, soll der Google-Font-Schalter dabei gerade nicht aktiviert werden. Sonst würde GenerateBlocks versuchen, die Schrift zusätzlich extern bei Google anzufordern.

5. Beispiel: lokal eingebundene Schrift in GenerateBlocks verwenden

Angenommen, du hast die Schrift „Roboto“ lokal eingebunden. Wähle den gewünschten Headline- oder Textblock und trage als Font Family:

Roboto

ein. Falls GenerateBlocks einen Schalter für Google Font anzeigt, lässt du ihn aus, wenn die Dateien bereits lokal bereitgestellt werden.

6. Schriftschnitte müssen ebenfalls vorhanden sein

Es reicht nicht, nur „Roboto“ als Familie einzubinden, wenn du anschließend font-weight: 700 verwendest, aber lokal nur die Datei für 400 vorhanden ist.

Für jeden benötigten Schnitt sollte ein passender @font-face-Eintrag existieren, zum Beispiel:

@font-face {
  font-family: 'Roboto';
  src: url('/fonts/roboto-regular.woff2') format('woff2');
  font-weight: 400;
}

@font-face {
  font-family: 'Roboto';
  src: url('/fonts/roboto-bold.woff2') format('woff2');
  font-weight: 700;
}

Fehlt der gewünschte Schnitt, simuliert der Browser möglicherweise Fettung oder fällt auf eine andere Schrift zurück.

7. GeneratePress-Typografie getrennt betrachten

GeneratePress besitzt eigene Typografie-Funktionen und dokumentiert ausdrücklich das Hinzufügen lokaler Schriften. Je nach Theme-Version und Konfiguration kann die Schrift dort zentral registriert werden und anschließend in den GeneratePress-Typografieeinstellungen verfügbar sein.

Das bedeutet aber nicht zwingend, dass jede Drittanbieter- oder Block-Auswahlliste denselben Datensatz nutzt.

8. GeneratePress und GenerateBlocks sind zwei Ebenen

Das ist die häufigste Denkfalle:

  • GeneratePress steuert das Theme und globale Bereiche.
  • GenerateBlocks steuert einzelne Blöcke und deren Styles.

Eine Schrift, die in GeneratePress registriert ist, kann im Frontend korrekt funktionieren, während GenerateBlocks sie nicht automatisch als Dropdown-Eintrag anbietet. Dann genügt häufig die manuelle Eingabe des Font-Family-Namens.

9. Cache nach Font-Änderungen leeren

Nach Änderungen an lokalen Fonts sollten mehrere Caches bedacht werden:

  • WordPress-/Caching-Plugin
  • Server-Cache
  • CDN
  • Browser-Cache

Fonts werden häufig sehr lange zwischengespeichert. Deshalb kann die Website trotz korrekter Änderung zunächst noch die alte Datei oder alte CSS-Regel verwenden.

10. CSS-Priorität kontrollieren

Wenn die Schrift im Editor eingestellt ist, aber im Frontend nicht erscheint, prüfe die berechneten Styles im Browser. Vielleicht überschreibt eine andere Regel die Font-Family.

Beispiel:

.entry-content p {
  font-family: Arial, sans-serif;
}

Eine solche spezifischere Regel kann eine globale Typografieeinstellung aushebeln.

11. Variable Fonts als Sonderfall

Viele moderne Google Fonts werden als variable Fonts angeboten. Dann kann eine einzelne Datei mehrere Gewichtungen enthalten. Die Einbindung muss aber entsprechend korrekt definiert sein.

Wenn du unsicher bist, ist für die Fehlersuche eine klassische getrennte Einbindung von Regular und Bold oft leichter nachzuvollziehen.

12. Datenschutz: lokal bedeutet wirklich lokal

Wenn du Google Fonts aus Datenschutzgründen lokal hostest, kontrolliere im Netzwerk-Tab des Browsers, dass keine Anfrage an fonts.googleapis.com oder fonts.gstatic.com mehr erfolgt.

Es reicht nicht, lokale Dateien zu haben, wenn ein Theme oder Block-Plugin dieselbe Schrift zusätzlich weiterhin extern lädt.

13. Wenn die Schrift nur im Editor anders aussieht

WordPress-Editor und Frontend können unterschiedliche Stylesheets laden. Deshalb ist es möglich, dass der Font im Frontend korrekt ist, aber im Block-Editor anders dargestellt wird – oder umgekehrt.

Für SEO und Besucher ist das Frontend entscheidend; für angenehmes Arbeiten sollte die Schrift aber idealerweise auch im Editor korrekt eingebunden sein.

14. Diagnose in der richtigen Reihenfolge

  1. Browser prüfen: Werden die lokalen Font-Dateien geladen?
  2. Exakten font-family-Namen feststellen.
  3. Prüfen, ob alle benötigten Gewichte vorhanden sind.
  4. Font-Namen in GenerateBlocks manuell eingeben.
  5. Google-Font-Schalter bei lokaler Einbindung deaktiviert lassen.
  6. GeneratePress-Typografie separat prüfen.
  7. Caches leeren.
  8. Im Frontend „Computed Styles“ auf Überschreibungen prüfen.
  9. Netzwerk prüfen, ob wirklich keine externe Google-Font-Anfrage mehr besteht.

Fazit

Wenn eine lokal installierte Google-Schrift in GeneratePress oder GenerateBlocks nicht in der Auswahlliste erscheint, bedeutet das nicht automatisch, dass die Installation fehlgeschlagen ist. Entscheidend ist, ob der Browser die Font-Datei lädt und welcher Font-Family-Name registriert wurde. GenerateBlocks erlaubt ausdrücklich die manuelle Eingabe eines Font-Namens. Bei lokal gehosteten Google Fonts bleibt die externe Google-Font-Option ausgeschaltet.

Aktuell geprüft

Die Hinweise zur lokalen GeneratePress-Typografie und zur manuellen Font-Family-Eingabe in GenerateBlocks wurden mit der aktuellen offiziellen Dokumentation abgeglichen.