In Divi Schriften lokal einbinden – lade eigene Schriftarten hoch

Kategorie: Divi & WordPress
Frau mit Laptop - Divi Schriften lokal einbinden
Hinweis: mit * markierte Links sind Affiliate Links. Das bedeutet, dass ich eine kleine Provision vom Verkauf bekomme.
Für dich entstehen aber keine zusätzliche Kosten 🙂

Google Fonts und eigene Schriftarten lokal auf deiner Divi Website einbinden

Im letzten Artikel haben wir ja bereits besprochen, was genau die Problematik mit Google Fonts ist und wieso diese nicht auf deiner Website geladen werden dürfen. Heute möchte ich dir zeigen, wie du sie auf deiner Divi Seite von Vornherein lokal einbindest. Das ist eine super einfache Schritt für Schritt Anleitung – also logg dich am besten direkt auf deiner Website ein und mach mir alles ganz genau nach!

Übrigens kannst du auf diese Art nicht nur Google Fonts lokal einbinden sondern auch jede andere beliebige Schriftart, die du vielleicht auf deiner Seite nutzen möchtest. Ich habe hier bereits einen Artikel geschrieben, in dem ich dir 5 Plattformen vorstelle, auf denen du richtig coole Schriftarten für deine Brand findest. Also schau dort gerne vorbei und lade dir schon mal deine Wunsch Schriftart herunter.

YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.
Mehr erfahren

Video laden

Google Fonts herunterladen

Wenn du eine bestimmte Schriftart von Google im Kopf hast, die du unbedingt nutzen möchtest, dann müssen wir diese zunächst herunterladen. Gehe dafür zu Google und gib Google Fonts ein. Unter dem ersten Treffer findest du nun alle Schriften und du kannst dir jede einzeln herunterladen.

Den Ordner können wir dann anschließend öffnen.

Hinweis: Du bist natürlich nicht verpflichtet Schriften von Google nutzen! Die Methode, die ich dir hier zeige, funktioniert auch mit anderen Schriftarten. In diesem Beitrag stelle ich dir 5 Tools vor, auf denen du die passende Schrift für dein Branding und deine Website findest.

Eigene Schriftarten bei Divi hochladen

Jetzt müssen wir unsere Schriftarten nur noch bei Divi hochladen. Dafür klickst du einfach in irgendein Modul, das Text beinhaltet, gehst dann auf den Design Reiter und klickst auf “hochladen”. Lade jetzt die ttf Datei deiner Schrift hoch und vergiss nicht einen Namen für die Schrift zu hinterlegen, damit du sie auch wiedererkennst.

Bei einigen Schriftarten (wie z.B. Open Sans) hast du alle verschiedenen Gewichte in einer Datei gespeichert. Wenn du diese Datei hochlädst, kannst du später zwischen den verschiedenen Gewichten auswählen (also z.B. Light, Semi Bold, Bold, etc.). Andere Schriftarten hingegen haben dies nicht. Hier musst du die einzelne Datei mit dem jeweiligen Gewicht, das du verwenden möchtest, extra hochladen.

Fehlermeldung verhindern

“Du bist leider nicht berechtigt diesen Dateityp hochzuladen”

Wird dir beim Hochladen deiner Google Font oder eigenen Schriftart diese Fehlermeldung angezeigt? Keine Panik! Als ich diesen Fehler das erste mal hatte, habe ich Stunden damit verbracht herauszufinden, woran es liegt und habe schließlich mehrere Lösungen dafür gefunden. Da ich ein Fan davon bin, Dinge so einfach wie möglich zu halten und Menschen nicht mit unnötig viel Technik Kram zu überfordern, stelle ich dir die schnellste und einfachste Methode jetzt vor.

Wir müssen unserer Website die Erlaubnis erteilen, Dateien mit ttf Endung hochzuladen. Dafür nutzen wir ganz einfach ein Plugin! Gehe in dein WordPress Backend, lade dir das Plugin “Enhanced Media Library” herunter und aktiviere es.
Klicke nun auf “Media Settings” -> “Mime Types” und gehe oben auf “Add new Mime Types”. Trage nun die folgenden Werte ein:

Extension: ttf
Mime Type: application/json
Singular Label: application/json
Plural Label: application/json
Allow Upload: Haken setzen

Klicke anschließend auf Änderungen speichern

Diese Beiträge könnten dir auch gefallen

Hola amiga!

Ich bin Anki. Deine beste Freundin rund um die Themen Website & Online Business.

let’s connect!

0€ Ratgeber

Von “DIY” zur Profi Website in nur einem Tag!

10 Design Fehler, die deine Seite als selbstgemacht entlarven

Klicke auf den unteren Button, um den Inhalt zu laden.

Inhalt laden

Mit der Anforderung des Ratgebers meldest du dich zu meinem gratis E-Mail NEWSLETTER an, in dem ich dir wertvolle Tipps verrate, mit denen du deine Website zu deinem besten Verkäufer machst und du als Erste von meinen neuen Angeboten erfährst. (Datenschutzerklärung)

Weitere Beiträge

Diese Beiträge könnten dir auch gefallen