Zum Inhalt

Google Fonts Importer

Google Fonts sind beliebt, kostenlos und in 1500+ Varianten verfügbar. Der direkte Einsatz via <link href="https://fonts.googleapis.com/..."> ist allerdings DSGVO-rechtlich problematisch – jeder Storefront-Request schickt die IP des Nutzers an Google.

Das Plugin importiert Google Fonts lokal, damit sie vom eigenen Server geladen werden – keine externen Calls zur Laufzeit.

Workflow

  1. Admin → Schriftarten-Manager → Tab „Google Fonts Importer"
  2. Schrift im Suchfeld finden (z.B. „Inter", „Roboto", „Open Sans")
  3. Subsets wählen (Sprachen): default „Latin" für DE/EN
  4. Gewichte wählen: default 400 (Regular) + 700 (Bold)
  5. Italic-Variants: ein/aus
  6. „Importieren" klicken
  7. Plugin lädt die Files von Google, speichert sie lokal in public/media/font/google/...
  8. Schrift erscheint in der normalen Schriften-Liste und kann zugewiesen werden

Welche Subsets brauchen?

Subsets definieren, welche Sprach-Zeichen importiert werden. Je mehr Subsets, desto größer die Datei.

Subset Sprachen Größe (Inter Regular)
Latin Englisch, Standard-Westeuropäisch ~30 KB
Latin-Ext + Osteuropäisch (PL, CZ, HU, …) ~45 KB
Cyrillic Russisch, Bulgarisch +20 KB
Greek Griechisch +10 KB

Für DE/EN-Shop: Latin + Latin-Ext (Latin-Ext enthält ä/ö/ü/ß).

Welche Gewichte brauchen?

Default 400 + 700 reicht oft. Wenn Du im Theme <strong> oder <b> nutzt, brauchst Du 700. Für besonders schwache (Thin/Light) oder schwere (Heavy/Black) Anwendungen weitere Gewichte.

Anzahl Files = Anzahl Variants × Subsets

Inter Regular Latin = 1 File. Inter Regular + Bold + Italic + Bold-Italic mit Latin + Latin-Ext = 8 Files.

Bei jedem File ein HTTP-Request, deshalb sparsam wählen.

Variable Fonts (Inter, Source Sans 3, …)

Viele moderne Google Fonts sind als Variable Fonts verfügbar: ein einziger File enthält alle Gewichte. Das Plugin nutzt automatisch die Variable-Variant, wenn verfügbar.

Vorteile:

  • 1 File statt 4–8
  • Kleinerer Total-Download
  • Alle Gewichte zwischen 100 und 900 verfügbar (auch ungewöhnliche wie 450, 550)

Subsetting (für Profis)

Bei großen Schriften wie „Noto Sans" mit Cyrillic + Greek + Vietnamese kann der Download auf wenige Hundert KB anwachsen. Über die Konfig kannst Du Subsetting aktivieren:

  • Plugin analysiert die im Storefront verwendeten Glyphs (per HTML-Render)
  • Reduziert die Schrift-Datei auf die tatsächlich benötigten Glyphs
  • Spart 30–80% Größe
Subsetting + dynamische Inhalte

Wenn Dein Storefront Inhalte mit selten verwendeten Zeichen rendert (z.B. mathematische Symbole, ostasiatische Zeichen), kann Subsetting diese ausschließen. Im Zweifel deaktivieren oder regelmäßig neu generieren.

Updaten einer Google Font

Google aktualisiert Schriften gelegentlich (Bug-Fixes, neue Glyphs). Im Plugin:

  • Schrift öffnen → „Auf neueste Version updaten"
  • Plugin lädt die aktuelle Version, ersetzt die alten Files
  • Browser-Cache wird durch geänderten Hash invalidiert

Lizenzen

Alle Google Fonts stehen unter Open Source Lizenzen (meist Open Font License, OFL). Das selbst-hosten ist explizit erlaubt.

Pro Schrift zeigt der Importer die genaue Lizenz an.

Fontsource als Alternative

Wenn Du Google Fonts magst, aber lieber unabhängig sein willst: Fontsource packagiert die gleichen Schriften ohne Google-Abhängigkeit. Im Plugin sind beide Quellen wählbar.

Weiter