Google Fonts werden heutzutage fast auf allen modernen Websiten verwendet. In Zeiten der DSGVO sind diese aber umstritten, da diese eine „Verbindung mit den Google Servern aufnehmen“ und so auch Daten übertragen können.
Einige Abmahnungen wurden diesbezüglich bereits versendet. Ob Google Fonts wirklich gegen die DSGVO sprechen, wird wohl erst nach eine Gerichtsurteil klar.
Stand heute werden 3 Szenarien empfohlen:
- Google Fonts in der Datenschutzerklärung erwähnen
- Google Fonts zu entfernen und nur Standardschriftarten zu verwenden
- Google Fonts auf dem eigenen Server hosten
Die 2. und 3. Möglichkeiten werden derzeit als die sichersten Methoden angesehen, welche glücklicherweise mit dem Divi Theme* sehr einfach und schnell umgesetzt werden können.
Google Fonts deaktivieren
- Gehe zu Divi – Themes-Optionen
- Im ersten Register „General“ findest Du die Option Google Fonts, welche Du nur deaktivieren musst.
- Speichern
Dies ist tatsächlich schon alles. Nun findest Du z.B. im Textmodul auch nur noch die Standardschriften.
Google Fonts auf dem eigenen Server hosten / Google Fonts lokal einbinden
Im Vergleich zu anderen Themes, ist auch dies bei Divi* sehr einfach.
- Deaktiviere Google Fonts wie oben beschrieben
- Nun öffne folgende Website http://google-webfonts-helper.herokuapp.com/fonts/
- Such deine gewünschte Google Schrift und klicke diese an.
- Bei „Select charsets“ und „Select styles“ kannst Du je nach Schriftart, Zeichensätze und Stile auswählen. Dies ist aber nicht bei jeder Schriftart möglich. „Copy CSS“ interessiert uns bei Divi nicht 🙂
- Klicke nun unten auf den Button „Download files„
- Die Schrift wird nun als Zip-File auf Deinen Computer heruntergeladen. Entpacke diese. Nun solltest Du die Schriftart in verschiedenen Datei-Formaten sehen.
- Gehe zurück zu Deiner WordPress Seite und öffne den Divi Builder und wähle ein Textmodul. Einfach eine Seite oder einen Beitrag öffnen. Dabei spielt es keine Rolle ob Du im Backend mit dem Divi Builder oder im Frontend mit dem visuellen Builder arbeitest.
- Hier im Beispiel sieht Du den Divi Builder im Backend. Gehe im Textmodul auf Design und dann z.B. auf Text Schriftart. Es spielt wirklich keine Rolle wo Du dies machst, es geht nur um die Auswahl einer Schriftart direkt im Divi Builder.
- Sobald Du nun eine Schriftart auswählen möchtest, siehst Du neben den Standardschriften auch einen Button „Hochladen“
- Klicke auf Hochladen
- Beim Feld Font Name (1) schreibst Du den Namen der Schriftart
- Auf den Button Choose Font Files (2) klicken und auf Deinem Computer die vorher runtergeladenen Schriften auswählen. (Ich empfehle alle Dateiformate auszuwählen)
- Nun auf Hochladen (3) klicken
Das war’s bereits. Wenn Du jetzt irgendwo bei Divi* eine Schriftart auswählen kannst, dann kannst Du nun auch diese „hochgeladene“ Schrift auswählen und verwenden.
Kleiner Hinweis: Bei Divi – Designmodifikator kannst Du nun die hochgeladene Schrift auch auswählen, aber oftmals wird diese dann in der Vorschau nicht angezeigt. Funktionieren tut es aber.
Videoanleitung
Hier der ganze Vorgang Google Fonts deaktivieren und lokal hosten als kurze Videoanleitung.
Welche Dateiformate braucht es?
Oben empfehle ich alle Dateiformate auszuwählen. Teilweise möchte man dies nicht, in seltenen Fällen funktioniert dies auch nicht.
Daher stellt sich die Frage, welches Format man wirklich benötigt.
Die Antwort ist einfach, für alle neuen Browser wird woff bzw. der Nachfolger woff2 empfohlen.
Also wenn Du „nur“ die woff Datei hochlädst, dann bist Du schon sehr gut dabei.
Weitere Infos zu den Dateiformaten und den Empfehlungen findest Du unter folgendem Link – Abschnitt „Formate und Browser“.
https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Schriftformatierung/@font-face
Viel Spass mit Divi und Deiner WordPress Seite…
… und denk daran, bleib natürlich auch online!
Lieber Gruss
Karin
Das ist genial erklärt! Genau das habe ich gerade gesucht. Lieben Dank für die super Erklärung.
Mein erster Kommentar liest sich wie Link-Fischerei … So war das aber nicht gemeint.
Ich versuche grade in einer Testumgebung, meine Website moderner zu gestalten und probiere zum ersten Mal Divi aus. Und bei vielen dieser komplexen Themes mit Pagebuildern und Pipapo finde ich es extrem kompliziert auf selbstgehostete Schriften umzustellen, wenn es mir denn überhaupt gelingt.
Deine Anleitung ist erstens super Verständlich und zweitens haben offenbar die Divi-Entwickler*innen mitgedacht. Und eine tolle Lösung entwickelt.
Danke Dir Anina! Freut mich sehr, dass ich Dir weiterhelfen konnte. Lieber Gruss Karin
Danke für den hilfreichen Beitrag Karin!
Das hat bei mir in der Vergangenheit auch schon mal geklappt, aber mit aktuellen Divi und aktuellem WordPress klappt das nicht mehr so. (Jetzt bei 3 verschiedenen Installationen getestet).
Problem: Ich kann den Knopf „Choose Font Files“ nicht mehr drücken! Erst wenn ich auf die Zeile drunter „Supported file formats…“ klicken kann ich eine Datei hochladen. ABER: Dann auch nur noch TTF und OTF kein WOFF oder WOFF2.
Divi-Version: 3.29.3
WordPress 5.2.3
Ist das bei dir auch so? Dann mache ich mal beim Hersteller ein Support-Ticket auf…
Viele Grüße,
Günther
Hallo Günther
Danke für Deinen Kommentar.
Meist liegt dieses Problem an der PHP Version. Daher diese mal kurzfristig ändern und dann nochmals testen. Alternativ kannst Du bei der wp-config.php Datei vorübergehend folgenden Code hinterlegen:
define(‚ALLOW_UNFILTERED_UPLOADS‘, true);
nach dem Upload der Schriftarten einfach den Code aus Sicherheitsgründen wieder entfernen.
Lieber Gruss
Karin