WordPress: Google Fonts einbauen DSGVO konform mit Plugin?

DSGVO Datenschutz Grundverordnung

Heute erkläre ich Dir, wie Du die beliebten Google Fonts DSGVO-konform richtig in WordPress einbauen und nutzen kannst, ohne eine teure Abmahnung zu riskieren.

Am 21. Januar 2022 verurteilte ein Landgericht in München eine Website-Betreiberin zur Zahlung von 100 Euro Schadensersatz. Ein Kläger beschwerte sich darüber, dass seine IP-Adresse ohne seine Zustimmung mittels der Font-Library an Google übermittelt wurde.

Das kleine Tutorial richtet sich an Betreiber einer WordPress-Website, die lieber ein Plugin hierfür verwenden möchten, statt die Google Fonts im Quellcode über einen Editor und ein FTP-Programm einzubauen.

Google Fonts ist ein Verzeichnis mit über 1300 kostenlosen Schriftarten für Webmaster. Wie Du deinen (für dich) perfekten Font findest, habe ich in einer anderen Anleitung erklärt. Heute beschreibe ich, wie Du deine gefundenen Fonts in WordPress in Einklang mit der Datenschutz-Grundverordnung installierst und rechtssicher nutzen kannst, ohne teure Post von einem Anwalt zu bekommen.


Warum kann der Einsatz von Google Fonts bestraft werden?

Wer gegen die DSGVO verstößt, macht sich Strafbar. Die Datenschutz-Grundverordnung schreibt fest, dass der Webseiten-Betreiber eine Einwilligung vom Website-Besucher einholen muss, bevor er (der Webseiten-Betreiber) Daten des Besuchers speichert oder eine Weitergabe an andere Webseiten, Dienste oder Unternehmen passiv oder aktiv weiter gibt.

Wenn eine Website einen Google Font dynamisch per „Google-URL“ einbindet, gelangt Google automatisch an die IP-Adresse, Hostdaten und Informationen zum Browser des Besuchers. Der Webseiten-Betreiber ist verpflichtet, den Besucher VORHER zu fragen, ob er der Weitergabe seiner Daten zustimmt. Sollte der Webmaster das vergessen, kann er strafrechtlich belangt werden.

Das generelle Problem: Die Google Fonts werden bereits geladen, wenn der Besucher die gewünschte Webseiten-Adresse in den Browser tippt, auf ENTER geht und der Server die ersten Daten der angefragten Webseite liefert – dann ist es bereits zu spät, den Besucher nach einer Erlaubnis zu fragen.

Natürlich ist die Nutzung der Google Fonts nicht verboten. Aber WENN sich auch nur EIN Besucher daran stört, dass seine IP-Adresse dank der Google Fonts in der USA gespeichert wird – kann der Webseiten-Betreiber sich nicht heraus reden.

Wenn es um sich sichere Einbindung und Nutzung von Google Fonts Schriftarten geht, bist du nur dann auf der sicheren Seite, wenn die Schriften auf deinem Server, oder in deinem Webspace gespeichert sind.


Wie baue ich Google Fonts rechtskonform in mein WordPress ein?

So ist es falsch!

Wie gesagt, dynamisch auf keinen Fall mehr. Bisher wurden gern Google Fonts in der style.css in folgender Art eingebaut, integriert:

@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital@0;1&family=Roboto:ital,wght@0,500;0,700;1,400;1,500&display=swap');

Oder im Header der Website mit:

<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= Pragati+Narrow & display=swap" rel="stylesheet">

Das sind die Methoden, bei der personenbezogene Informationen des Besuchers an den Server hinter der Adresse „https://fonts.googleapis.com“ übertagen werden.


Die DSGVO-konforme Lösung – manuell

Die (richtige) Lösung nennt sich: statischer Einbau. Die Datei mit der gewünschten Schriftart wird dabei von der Google Fonts Plattform auf deinen Windows- oder Mac-PC herunter geladen und dann mittels FTP-Programm auf deinen eigenen Server (oder Webspace) hoch geladen.

Schritt 1.) Suche nach dem richtigen Font

Zuerst gehst Du zur Google Fonts Website. Aus über 1.300 Schriftarten kannst Du die für dich passenden Font sehr einfach heraus suchen. Wie Du deinen perfekten Webfont findest, habe ich HIER erklärt.

Die hier angezeigten Fonts kannst Du aber nur als TTF-Font herunter laden. Moderne Browser wollen jedoch etwas anderes, sie wollen das woff/woff2-Format. Deshalb machst Du jetzt einen Umweg über den Google Webfonts Helper.

Schritt 2.) Nutze den Google Webfonts Helper

Ruf den Google Webfonts Helper auf, trage links oben die bei Google Fonts gefundene Schriftart ein und Klicke auf den gefundenen Font

1.) Wähle im rechten Fenster das Charset

2.) Markiere die benötigten Styles

Merke: Jeder zusätzliche Style führt zu … Blähungen. Wähle deshalb nur die Stile aus, die du auch wirklich nutzen möchtest.

3.) Entscheide dich für „Best Support“ oder „Modern Browsers“

Den daraufhin im unteren Fenster genierten CSS-Code kopierst du.

Gehe in deinen Admin-Bereich zu Design >>> Theme Editor, selektiere oben rechts das Template aus, welches die neuen lokalen Schriftarten verwenden soll und klicke darunter auf die zu bearbeitende Datei – die „style.css“.

Am Dateiende kopierst Du den neuen CS-Block rein, drückst auf den Button „Datei aktualisieren“ und die neue Schrift ist im System eingetragen. Jetzt muss die neue Schrifft nur noch auf deinen Webspace hochgeladen werden.

4.) Lade die gezippte Datei auf deinen Rechner

Schritt 3.) Lade die Dateien auf deinen Server

  • Entpacke die herunter geladene gezippte Datei
  • Starte dein FTP Programm.
  • Suche den Unterordner „Fonts“ in deinem Template.  Du findest ihn im Verzeichnis deines Theme (\wp-content\themes\…)
  • Kopiere die entpackten Dateien hoch in den ausgewählten Ordner.

Schritt 4.) Google Webfonts in WordPress mit einer Funktion deaktivieren

Du solltest die Google Fonts in deinem Template / Theme entfernen. Du weißt nie, ob ein WordPress Plugin entgegen der DSGVO einen Font dynamisch per URL zum Google-Server einbindet. Die DSGVO ist eine europäische Sache, die Entwicklern in Indien, der USA oder den Philippinen nicht kümmert. Das NextGEN Gallery Plugin lädt beispielsweise die Open Fonts Schriftart Open Sans.

Allerdings ist das bei vielen Themes ein Problem, da es dafür oft keine Einstellmöglichkeit gibt. Mein „MH-Magazine“ Theme hat eine Möglichkeit zum deaktivieren der Google Fonts, das Theme „Admiral wieder nicht.

Gut dran ist, wer selber Hand anlegen kann. Das folgende, in der functions.php einzutragende, Code Snippet entfernt die Google Fonts mit Hilfe der WordPress-Funktion „wp_dequeue_style“.

function removeGoogleFonts(){
		global $wp_styles;
			$regex = '/fonts\.googleapis\.com\/css\?family/i';
			foreach($wp_styles->registered as $registered) {

				if( preg_match($regex, $registered->src) ) {
					wp_dequeue_style($registered->handle);
				}
			}
		}
add_action('wp_enqueue_scripts', 'removeGoogleFonts', 999);

Achtung: Vor Änderungen an der functions.php solltest du ein Backup machen. Dazu empfehle ich das Plugin BackWPup.


Die DSGVO-konforme Lösung – per Plugin

Sehr aufwendig ist die manuelle Installation von lokalen Fonts nicht. Doch es ist auch nicht jedermanns Sache, am Quellcode herum zu spielen und Dateien auf den Server laden zu müssen. Die Meisten nutzen WordPress für ihren Blog, verstehen sich eher als Autoren, statt Programmierer. Genau für jede Zielgruppe gibt es mittlerweile auch (wenige) Plugins. Zwei davon stelle ich euch vor. Leider gibt es das „gute Zeug“ nicht kostenlos – Du musst schon eine PRO-Version kaufen.


Möglichkeit 1: Das Plugin „Elementor“ – Der Page Builder

Page Builder sind Programme zum erstellen eigener Themes (Templates) per Drag-and-Drop. Elemente werden per Mausklick angewählt, konfiguriert und platziert. Das Page Builder Plugin Elementor gehört zu den Platzhirschen der Branche.
Mit der kostenpflichtigen PRO Version von Elementor kannst Du ganz einfach Schriftarten lokal einbinden. Unter Elementor >>> Benutzerdefinierte Schriftarten lädst du Webfonts oder TypeKit Fonts hoch.

Fazit: Allerdings kostet Elementor PRO 89 $ im Jahr und es ist fraglich, ob ein derart „fettes“ Programm wirklich nötig ist, um eine Handvoll Schriftarten lokal zu hosten. Es ist, als würdest Du mit einer Kanone auf Spatzen schießen.

Die Premium-Version des Plugin kannst du offiziell und legal kostenlos in einem sogenanntem GPL-Club herunterladen und nutzen. Nach Zahlung einer geringen Gebühr stehen alle im Software-Club verfügbaren Premium-Plugins zum Download zur Verfügung. Möglich ist das durch die GPL -Lizenz für „freie Software“, unter welcher die meisten WordPress-Plugins veröffentlicht werden.


Möglichkeit 2: Das Plugin „OMGF“ (Optimize My Google Fonts)

Der Anbieter von OMGF stellt eine kostenlose Basis-Version und eine kostenpflichtige Pro-Version zur Verfügung.

Unter OMGF >>> Erkennungseinstellungen findest du ein Auswahlfeld zur „Google Fonts Verarbeitung“ mit dem Erklärungstext: „Wähle aus, ob OMGF alle Google Fonts (finden, herunterladen und) ersetzen, oder sie nur entfernen soll. Wenn du Entfernen wählst, wird WordPress auf die Systemschriftarten zurückgreifen.“



Möglichkeit 3: Das Plugin „Font Blocker“ vom Entwickler Borlabs


Dieses Plugin wirbt mit den Versprechungen:

  • Borlabs Font Blocker hilft dir dabei, Google Fonts Einbindungen von Themes und Plugins automatisch zu blockieren.
  • Einfach herunterladen, in WordPress über die Plugin-Verwaltung hochladen und aktivieren, fertig.
  • Es sind keine Einstellungen notwendig, um mit Borlabs Font Blocker umgehend Einbindungen von Google Fonts zu blockieren.

Eine weiterführende Anleitung findest du HIER.