Google Fonts deaktivieren oder lokal einbinden

In unserem folgenden Beitrag stellen wir Dir verschiedene Arten vor, wie Du Deine Google Fonts auf Deiner Website richtig erkennst, deaktivierst oder lokal lädst, damit Du keinerlei Probleme in Sachen Datenschutz bekommst.

Wieso sind Google Fonts so stark verbreitet und wieso kann deren Verwendung problematisch werden?

Google stellt seit Jahren eine gewaltige und kostenlose Palette (über 1400 Stück) an Schriftarten zur Verfügung. Google Fonts bieten zwei große Vorteile:

1. Da die Schriftarten online sind, ist es nicht notwendig gewisse Schriftarten auf Deinem Server zur Verfügung zu stellen – sie werden einfach über Code-Snippets in die von Dir verwendeten Themes automatisch geladen.
2. Alle Google Fonts sehen für Deine Nutzer – unabhängig von Endgerät – immer gleich aus. Das ist benutzerfreundlich, sowohl für Dich als auch für Deine Kunden.

Eben weil Google Fonts online zur Verfügung gestellt werden, sind sie heikel, da jene Schriftarten standardmäßig vom Google Server bereitgestellt werden. Zwar streitet Google ab, das persönliche Daten der Nutzer über Google Fonts gespeichert werden, rechtlich stellen Google Server aber leider immer noch eine Black Box dar. Ein weiterer Nachteil ist beispielsweise die beeinträchtigte Performance Deiner Website durch das Warten auf externe Ressourcen. Auch das sogenannte Caching jener Schriftarten ist problematisch, da statt nach einer Woche jene Dateien beim erneuten Aufruf eine Stunde später erneut heruntergeladen werden.

Erstellt von Joel Burghardt

Geschäftsführer und leitender SEO-Manager von Lightweb Media. Ich unterstütze Unternehmen jeder Größe bei der Steigerung ihrer Sichtbarkeit unter anderem mithilfe von SEO Audits.
Zudem entwickle ich mit unserem Team performante WordPress-Themes sowie Plugins nach aktuellen Standards.

Mehr über uns

Wie kannst Du nachschauen, ob Deine WordPress Seite bzw. Dein Theme Google Fonts verwendet?

Erfahrungsgemäß können wir sagen, dass es ziemlich wahrscheinlich ist, dass Du Google Fonts auf Deiner Website verwendest. Um zu überprüfen welche genau und in welchem Ausmaß, kannst Du unter anderem die Tools Pingdom, webbkoll.dataskydd.net oder CSP nutzen.

Solltest Du Google Fonts verwenden, siehst Du das anhand der Info „fonts.googleapis.com“. Eine noch genauere Überprüfung zeigt Dir sogar welche Schriftarten Du genau verwendest und wie lange Deine Website für den Aufruf einer solchen Schriftart benötigt.

Ein noch einfacherer Weg, wie Du nachschauen kannst ist über Deinen Google Chrome Browser:

1. Rufe Deine Seite auf
2. Klicke dann auf die Taste F12 (Entwicklerkonsole)
3. Gehe auf „Netzwerk“ und suche nach „fonts.googleapis.com“
4. F5 (Neu laden der Seite)

Firefox bietet die selben Funktionen in der Entwicklerkonsole -> Netzwerk.

Tipp: Automatisiere Deinen Workflow mit Python

Wenn Du viele Webseiten betreibst, möchtest Du wahrscheinlich nicht jede einzelne Domain per Hand prüfen.

Das ist ein Command Line Script auf Basis Python und scannt eine Liste (CSV) von Domains nach Google Fonts Link Tags. Diese werden in eine weitere CSV Datei geschrieben.

Die Deaktivierung von Google Fonts auf Deiner Website

Damit Du Dir die genannten Probleme ersparst, haben wir Dir drei Arten aufgelistet, wie Du Google Fonts auf Deiner Website deaktivieren kannst:

• Google Fonts direkt im Theme oder in Elementor deaktivieren
• Google Fonts anhand der functions.php deaktivieren.
• Google Fonts mithilfe von Plugins deaktivieren.

Google Fonts bei Elementor deaktivieren

Das bedeutet, dass verschiedene Theme Entwickler und auch die Entwickler vom wohl berühmtesten Pagebuilder Elementor nicht schlafen, sondern immer weiter daran arbeiten, Dir eine optimale und vor allem sichere Nutzung gewährleisten zu können. Bei Premium-Themes ist das mittlerweile gang und gäbe, aber auch kostenlose Themes führen immer öfter in ihren Einstellungen die Funktion „Disable Google Fonts“ mit. So haben beispielsweise Avada, DIVI und Enfold diese Funktionen bereits erfolgreich in ihr System implementieren können. Auch Elementor bietet in seinen Einstellungen die Deaktivierung von Standardschriftarten an. Sollte das nicht so funktionieren, wie Du Dir das vorstellt, integriere den folgenden Code in Deine functions.php Datei des Templates.

Für Google Fonts:

add_filter( 'elementor/frontend/print_google_fonts', '__return_false');

Für Font Awesome Icons:

add_action( 'wp_enqueue_scripts', function() { wp_dequeue_style( 'font-awesome' ); }, 50 );

Google Fonts anhand der functions.php deaktivieren

Möchtest Du absolut sicher gehen, dass Deine Google Fonts deaktiviert sind, verweisen wir Dich auf die functions.php Datei. Google Fonts sind nämlich in der Regel über die functions.php Datei verbunden. Um diese Verbindung zu trennen, muss ein dequeue-Befehl eingebaut werden.

add_action('wp_print_styles', 'twentyseventeen_dequeue_styles', 100);

function twentyseventeen_dequeue_styles() {
wp_dequeue_style( 'twentyseventeen-fonts' );}

Alternativ kannst Du auch eine De-Registierung der Google Fonts einbinden. Im Beispiel wird das Theme TwentySeventeen genommen.

add_action('wp_print_styles', 'twentyseventeen_deregister_styles', 100);

function twentyseventeen_deregister_styles() {
wp_deregister_style( 'twentyseventeen-fonts' );}

Google Fonts bei Enfold Theme deaktivieren

1. In Enfold > Allgemeines Styling > Schriften nach den verwendeten Fonts schauen
2. auf WebFontHelper die Schriftart suchen
3. benötigte Schriftschnitte (300,regular,600,italic etc.) anklicken und als Zip downloaden
4. Unter Enfold > Import/Export > Benutzerdefinierter Schriftart-Manager die ZIP hochladen
5. In Enfold > Allgemeines Styling > Schriften nach unten scrollen und die hochgeladenen Schriften aktivieren
6. Fertig

Google Fonts mithilfe von Plugins deaktivieren

Die wohl einfachste und meistgenutzte Art Google Fonts zu deaktivieren ist mithilfe von Plugins. Wir stellen Dir hier verschiedene Plugins vor.

Disable Google Fonts: Der Klassiker! Mit diesem Plugin wird die Deaktivierung der Google Fonts zum Kinderspiel. Wer nach „Einstellungen“ Ausschau hält sucht vergebens – nach der Aktvierung des Plugins werden sämtliche Google Fonts automatisch deaktiviert.

Bei Premium-Themes und umfangreicheren kostenlosen Themes zeigt das Plugin Schwächen und funktioniert in vielen Fällen leider gar nicht. Sollte das bei Dir der Fall sein bearbeite Deine functions.php Datei.

Autoptimize: Was viele nicht wissen – dieses Plugin hilft nicht nur die Leistung Deiner Webseite zu verbessern, sondern deaktiviert auch Google Schriftarten. Auch dieses Plugin führt nicht immer zur idealen Lösung. Der Gedanke der Entwickler war es, die Funktion zur Deaktivierung der Google Fonts lediglich auszuprobieren und dann weiter manuell zu bearbeiten bzw. zu überprüfen.

Clearfy: Dieses Plugin ähnelt sehr dem Autoptmize, ist nur weniger bekannt. Es dient in erster Linie ebenfalls der Verbesserung der Leistung. Dennoch ist es erstaunlich wie viele Google Fonts nach dem Einrichten des Plugins deaktiviert werden. Um jegliche Google Fonts abzudrehen verweisen wir auch hier wieder auf die manuelle Art.

Borlabs Font Blocker: 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.

GoogleFonts lokal laden – die Alternative zur Deaktivierung

Wer die GoogleFonts lokal speichern möchte, kann dies u.a. über das Plugin OMGF realisieren. Dieses Plugin legt in der Regel einen Ordner mit der Schrift an und speichert diese lokal. In der kostenfreien Version funktioniert es bei unseren Kunden in ca 50% der Fälle, OMGF in der Proversion behebt meist den Rest. In der Vergangenheit gab es einige Probleme, vor allem verwechselte Fonts, WP Rest API Fehler usw.

Mit Google Webfonts Helper manuell lokal laden

Eine weitere Herangehensweise ist die Speicherung der Fonts im Themeordner und Aufruf mittels Style.css sowie die Einbindung über die Funktion.php. Dazu werden die Fonts auf Google Webfonts Helper heruntergeladen, sowie der entsprechend angezeigte CSS Code so angepasst, dass der Pfad zum Ordner mit den Fonts korrekt ist. Dieser wird in der style.css des Child Themes oder im Customizer abgespeichert.
Nachträglich wird über Webbkoll geprüft, ob die Verbindungen zu Google weiterhin aufgebaut werden (Cache leeren auf der Website sowie Webbkoll).

Tipp für die Angabe des Pfades:

• der Ursprungspfad ist domain/wp-content/themes/themename/, ab hier fragt er ab, wo die fonts per FTP gespeichert sind.
• Sind diese im Themesordner gespeichert, muss man die „../“ unter Customize folder prefix entfernen.

Fazit zu Google Fonts lokal laden oder deaktivieren

Unerfahrenen empfehlen wir soweit wie möglich auf die Variante mit den Plugins auszuweichen und die Finger vom Code zu lassen. Wenn Du Dir total unsicher bist, kannst Du auch das extra dafür aufgelegte Font Blocker Plugin von Borlabs installieren. Sollten Plugins nicht zum Ziel führen suche Dir einen Profi, der Dir die die Fonts richtig lädt.

Ein absolutes Muss ist es ohnehin nicht – mit der Deaktivierung bist Du aber vor allem Datenschutztechnisch auf der sicheren Seite. Wir hoffen Dir mit unserem Beitrag jedenfalls erklärt zu haben, wie Du Google Fonts auf Deiner Website richtig und sauber deaktivieren sowie lokal laden kannst. Bitte teile uns Deine Meinung mit 🙂