Google Fonts DSGVO-konform (in Divi) verwenden

CS Webdesigns

Was dich in diesem Beitrag erwartet.

Wie kannst du Google Fonts auf deiner Divi-Webseite DSGVO-konform verwenden? Die Antworten findest Schritt für Schritt in diesem Guide.
Wenn du dich bereits ein wenig mit der DSGVO und dem TTDSG auseinandergesetzt hast, wirst du mit Sicherheit schon darauf gestoßen sein, dass auch die Verwendung von Google Fonts zum Datenaustausch mit den USA (Drittland im Bezug auf Datenschutz) führt.

Die meisten WordPress-Themes arbeiten mit den Google Fonts als Schriftarten. Das ist zum einen natürlich bequem, ist in Europa jedoch rechtswidrig.

Diese Rechtswidrigkeit lässt sich relativ einfach umgehen, indem man die kostenlos zugängigen Schriftarten lokal in die WordPress-Installation hochlädt.

Wo kann ich Google Fonts herunterladen?

Die Google Schriftarten stehen unter https://fonts.google.com kostenlos zum Download zur Verfügung.

Übrigens: Google hat mittlerweile auch Icons im Angebot: https://fonts.google.com/icons.

Schriftarten in Divi hochladen

In Divi ist es relativ einfach, eine Schriftart hochzuladen und dann lokal zu verwenden.

Dafür musst du lediglich im Divi Builder bei einer beliebigen Seite in die Einstellungen eines Moduls navigieren und dort im Reiter Design den Umschalter „Text“ aufklappen. Dort findest du die Einstellung Schriftart und kannst dort Schriftart hochladen auswählen. Dort wählst du dann die zuvor heruntergeladene Schriftart aus, gibst ihr einen Namen (am besten Name der Schriftart) und klickst auf hochladen.

Divi Schriftart in den Einstellungen hochladen 1  Divi Schriftart hochladen

Häufig erscheint hier folgende Fehlermeldung „Dateityp wird aus Sicherheitsgründen nicht unterstützt.“ oder „Dateityp aus Sicherheitsgründen unzulässig.“.

Schriftart hochladen - Dateityp unzulässig

Wie löse ich das Problem des nicht unterstützten Dateityps? 

Um den Upload des notwendigen Dateityps (.otf oder .tff) freizugeben musst du vorübergehend die wp-config.php in deinem WordPress-Verzeichnis um eine Codezeile erweitern.

Navigiere dazu über einen FTP-Client (z.B. FileZilla), über deinen Host (z.B. WP Space) oder WordPress-Plugin (z.B. WP Dateimanager) in das Hauptverzeichnis deiner WordPress-Installation und öffne die Datei wp-config.php.

Dort muss folgender Code eingefügt werden:

define( 'ALLOW_UNFILTERED_UPLOADS', true);

Divi Schriftart hochladen Dateityp unzulässig Code in wp-config

Hinweis: Falls es dort einen Kommentar „That’s all, stop editing! Happy publishing.“ gibt, muss die Codezeile darüber eingefügt werden.

Danach kannst du über das oben beschriebene Vorgehen die Schriftart hochladen.

Achtung: Nachdem du diese hochgeladen hast, solltest du den eingesetzten Befehl wieder rausnehmen!

Zu guter Letzt: CSS des Google Webfontshelper in deine Style.css einfügen

Nachdem nun die Google Schirftart auf deinem Server liegt, musst du noch ein wenig Code in der Style.css anpassen. Keine Sorge, das ist nur copy & paste. 

Wenn du die Schriftart wie beschrieben hochgeladen hast, findest du deine Schriftarten im folgenden Pfad deiner WP-Installation: /wp-content/uploads/et-fonts/

Diesen fügst du beim Google Webfontshelper bei „Customize folder prefix“ ein. Daraufhin setzt das Tool deinen Pfad in den CSS-Code und du musst dir diesen nur noch per STRG oder CMD + C in die Zwischenablage speichern.

Google Fonts Webhelper

Diesen Code fügst du nun am Ende der Style.css ein und speicherst die Datei. Je nachdem, ob du ein Child Theme verwendest, findest du die Style.css im Haupttheme-Ordner oder ChildTheme Ordner unter /wp-content/themes/.

Damit hast du deine Schriftart lokal eingebunden. Wenn du mehrere Schriftarten verwendest, wiederhole diesen Vorgang einfach noch einmal.

Jetzt empfehle ich dir, das Setup noch kurz zu überprüfen. Wie erfährst du im nächsten Abschnitt.

So prüfst du, ob deine Schriftarten auch wirklich lokal verwendet werden

Danach solltest du überall auf deiner Webseite die lokale Schriftart einsetzen bzw. verwenden.

Tipp: Deaktiviere auch in den Divi-Einstellungen die Verwendung der Google Fonts. Navigiere dazu in die Theme-Optionen – Allgemein und deaktiviere die Option „Google Schriftarten verwenden“.

Google Schriftarten in den Divi Einstellungen deaktivieren

Danach solltest du die korrekte Verwendung deiner Schriftarten sicherstellen, indem du im Browser – mein Favorit Google Chrome – in die Entwicklertools (F12-Taste drücken) wechselst und dort in Network, wähle Font aus und lade deine Seite neu. Danach siehst du alle verwendeten Schriftarten der soeben geladenen Seite. Hier sollte unter Domain die eigene Domain stehen. Steht hier etwas anderes, musst du nochmal prüfen und die Schriftartenauswahl an einer Stelle korrigieren.

Lokale Verwendung der Google Fonts Schriftarten prüfen

 

Für alle Fälle: Der Borlabs Fonts Blocker

Wenn hier trotzdem noch Google Fonts auftauchen, kannst du den Font Blocker von Borlabs verwenden, um diese ein für alle Mal zu deaktivieren. Prüfe danach deine Seite noch einmal, ob die Schriftart bei allen Texten passt. 

Das Plugin kannst du hier herunterladen: Borlabs Font Blocker

Sobald du es installiert und aktiviert hast, kappt das Plugin alle Verbindungen zu Google bezüglich deren Fonts. 

Fazit

  • Die Verwendung von nicht lokal gespeicherten Google Fonts verstößt gegen die DSGVO.
  • Dies kann relativ einfach behoben werden:  Hochladen und verwenden von lokalen Schriftarten.
  • Das bekannte „Dateityp nicht zulässig“-Problem lässt sich durch einen einzeiligen Code umgehen. Wichtig: Danach wieder rausnehmen!
  • Kontrolliere danach unbedingt mithilfe der Entwicklertools, ob du auch wirklich nur noch lokale Schiftarten verwendest.

0 Kommentare

Einen Kommentar abschicken

Deine E-Mail-Adresse wird nicht veröffentlicht.