Google Fonts in WordPress DSGVO-konform einbinden

Am 25. Mai 2018 wurde die Datenschutz-Grundverordnung in Kraft gesetzt. Seitdem müssen Website-Besucher einiges beachten, um die Verordnung einzuhalten. Unter anderem ist eine Datenschutzerklärung Pflicht, Freebies müssen transparenter angeboten werden und Google Fonts sollten besser nicht mehr via Google Server eingebunden, sondern lokal auf der Website gehostet werden. Ich zeige Dir in diesem Beitrag, wie Du Google Fonts in WordPress DSGVO-konform einbindest.

Warum ist das direkte Einbinden von Google Fonts „verboten“?

Die Google-Fonts liegen auf einem Server in den USA. Um die gewünschte Schriftart zu nutzen, wird diese über einen Google-Server geladen und eine Verbindung hergestellt. Das ausschlaggebende dabei ist, dass Deine IP Adresse an Google gesendet wird. Wenn Du Google Fonts also auf Deiner Website nutzt, wird bei jedem Besucher auf Deiner Website eine Verbindung hergestellt und die IP Adresse an Google versendet.

Laut Google werden hierbei zwar keine Cookies gesetzt und es sollte reichen die Google Fonts in der Datenschutzerklärung zu erwähnen. Allerdings gab es bereits Abmahnungen in Bezug auf die Google Fonts. Darum empfehle ich Dir Google Fonts in WordPress DSGVO-konform einzubinden und Deine Schriftarten lokal auf Deinem Server zu speichern.

Werden Google Fonts auf meiner Seite geladen?

Google-SourcesDie meisten Themes binden Google Fonts ein. Ob es bei Dir auch so ist, kannst Du ganz einfach herausfinden. Wenn Du Google Chrome als Browser nutzt klicke die rechte Maustaste und anschließend auf Untersuchen. Es öffnet sich rechts im Browser ein Fenster. Wenn Du hier auf Sources klickst, findest Du die Zeile fonts.googleapis.com, wenn Deine Seite Google Fonts verwendet.

So bindest Du Google Fonts in WordPress DSGVO-konform ein:

1. Erstelle ein Child-Theme

Ein Child-Theme ist wichtig, da Du in den nächsten Schritten Änderungen am Theme vornehmen wirst. Wenn Du diese im Haupt-Theme machen würdest, würden diese Änderungen beim nächsten Update überschrieben werden und Du müsstest von vorne beginnen.

Mit einem WordPress Child-Theme kannst Du dein Haupt-Theme ganz normal updaten, aber die Änderungen des Child-Themes bleiben auf der Website sichtbar. Wie Du so ein Child-Theme korrekt erstellst, kannst Du in meinem Beitrag „So erstellst Du ein WordPress Child Theme“ nachlesen.

2. Download Deiner Google Fonts

Im nächsten Schritt suchst Du die Schriftarten, die Du nutzt unter Google Fonts oder im Google Webfonts Helper und lädst sie dort herunter.

CSS-Font-einbinden

3. Upload der Dateien auf deinen Server

Wenn Du alle Schriftarten zusammengesucht hast, packe sie in einen Ordner und nenne diesen Ordner fonts. Dieser muss im Anschluss auf Deinen Server geladen werden. Hierzu nutzt Du einen FTP-Client, ich empfehle Dir FileZilla. Deine FTP-Zugangsdaten erhältst du von Deinem Hosting-Anbieter, falls Du sie noch nicht kennst.

Lade dann den fonts Ordner im Child-Theme auf Deinen Server.

4. Anpassung deines CSS

Die gewählten Schriftarten müssen nun noch in Deinem Stylesheet eingebunden werden. Dieses kannst Du ebenfalls mithilfe von FileZilla herunterladen. Dann bearbeitest Du den Code mit einen Editor, z.B. Textwrangler und lädst die Datei anschließend wieder hoch.

Oben im Screenshot siehst Du bereits den Code, den Du dafür nutzt. Dieser lässt sich mit einem Klick auf den Code kopieren und dann in Dein Sheet einfügen.

Achte darauf, dass wenn du wie empfohlen einen Fonts-Ordner erstellt hast, dass du die Pfade anpasst. Ansonsten findet der Code die Dateien auf deinem Server nicht. Hierzu nutzt du das Feld „Customize folder prefix“ unterhalb des Codes. Der Code aktualisiert sich automatisch, sobald du dort Text einfügst.

5. Verbindung zum Google Server entfernen

Zum Abschluss musst Du noch die Verweise zum Google-Server und den dort liegenden Google-Fonts entfernen. Das kannst Du mit einem Plugin machen. Hier funktioniert zum Beispiel Disable Google Fonts. Auch mithilfe des Plugins Autoptimize, welches viele Website-Besitzer bereits nutzen, ist die Entfernung in den Einstellungen unter Extras möglich.

Prüfung

Wenn du diesen letzten Schritt getan hast, solltest Du das Ganze noch einmal testen. Klicke dazu wieder mit rechts auf deine Website und auf Untersuchen. Im Sources Bereich sollten die Google Fonts nun nicht mehr zu sehen sein.

Ich hoffe, ich konnte Dir mit dieser Schritt-für-Schritt-Anleitung weiterhelfen, damit Du zukünftig Google Fonts in WordPress DSGVO-konform einbindest.

Wenn etwas unklar ist oder Du Fragen hast, schreibe gerne einen Kommentar.

 

 

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Google-fonts-einbinden
Nach oben

Werde teil der WordPress Made Easy Community!

Deine Website ist das Aushängeschild Deines Unternehmens und Deine digitale Visitenkarte. Genau darum, sollte Deine Website richtig rocken. Mach Deine Website zum Rock´n´Roll Superstar und werde Teil der kostenlosen WordPress Community ‚WordPress Made Easy‘!

Als Mitglied unserer Community erhältst Du regelmäßig:

  • kostenlose Tipps & Tricks sowie Ressourcen rund um das Thema WordPress und Trafficsteigerung
  • kostenlose Downloads, Checklisten und PDFs
  • aktuelle Informationen zu besonderen Angeboten
Was würdest Du tun, wenn Deine Website richtig rockt?

Trage Dich in meine E-Mail-Liste ein und erfahre, wie Du Deine Website zum Rocken bringst.

Du kannst jederzeit den Newsletter über einen Abmeldelink abbestellen. Meine E-Mails können gelegentlich Produktvorschläge enthalten. Deine Anmeldedaten, deren Protokollierung, der E-Mail-Versand und eine statistische Auswertung des Leseverhaltens, werden über Mailerlite, Litauen verarbeitet. Mehr dazu kannst Du auch in meiner Datenschutzerklärung nachlesen.