Schriften in DIVI anzeigen

Du hast Google Fonts in DIVI hochgeladen und nach dem Speichern wird eine Standardschrift angezeigt?

13 Jan, 2022

(Weiter unten zeige ich dir, wie du Fonts ganz einfach in DIVI hochlädst.)

Du hast im DIVI Builder eine eigene Schrift / einen Google Font hochgeladen und nach Speichern des Builders wird im Frontend wieder eine Standardschrift angezeigt?

Sicher geht es dir gerade wie mir damals und du bist verzweifelt auf der Suche, um den Fehler zu beheben.

Ich erkläre dir sofort, wie du den Fehler beheben kannst.

Danach zeige ich dir, wie du Google Fonts bei DIVI hochladen kannst. Alles so, dass DIVI nie wieder deine Fonts verschluckt.

Mockup Autoren

Kleines Budget, aber Website soll her?

Da sind meine fertigen Webseiten für Business-Starter perfekt!

Wie deine Fonts/Schrift in DIVI auch nach Beenden des Visual Builders angezeigt werden

Einige Teile deiner Website werden noch als http ausgegeben. Das kannst du ganz einfach ändern:

Font in DIVI anzeigen – Möglichkeit 1:

Das Plugin Really Simple SSL installieren & aktivieren, in die Plugin-Einstellungen gehen, alles auf https umstellen, das Plugin löschen und https behalten klicken. Sicherheitshalber installierst du das Plugin, lädst die Schriften hoch und löscht das Plugin erst dann wieder.

Jetzt noch den DIVI-Cache unter Optionen und evtl auch den Cache deines Optimierungsplugins leeren.

Font in DIVI anzeigen – Möglichkeit 2:

Das Plugin Better Search Replace installieren & aktivieren, unter WordPress Werkzeuge das Plugin aufrufen, alle Tabellen markieren (die ganzen Einträge da in dem kleinen Fenster in der Mitte. Markiere das oberste, halte Shift gedrückt und markiere das unterste) und gib in die beiden Zeilen darüber einmal deine Domain mit http und darunter mit https an.

Beispiel bei mir: Ersetze https://nadinschmidt.com/ durch https://nadinschmidt.com/

Plugin Better search replace einstellen

Das Plugin führt einen Testlauf durch, der dir anzeigt, wie viele Einträge gefunden wurden. Entferne jetzt den Haken beim Auswahlfeld Testlauf und starte die Ausführung nochmal.

Das Plugin kannst du jetzt wieder löschen, alle http Einträge wurden durch https ersetzt.

Jetzt noch den DIVI-Cache unter Optionen und evtl auch den Cache deines Optimierungsplugins leeren.

Soviel dazu, wie du es lösen kannst. Zumindest funktioniert es jetzt.

Wieso du deine Google Fonts immer in DIVI hochladen solltest

Du lädst sie damit auf deinen Server. Die Schrift liegt bei dir ab und wenn jemand deine Seite aufruft, wird sie von deinem Server abgerufen. Nicht von Google oder sonst wem. Das passiert nämlich bei Google Fonts, wenn du sie standardmäßig mit DIVI verwendest.

Das ist aus datenschutzsicht nicht erlaubt. Jeder Websitebesucher mit etwas Know-how kann das sehen.

Das kann dann so aussehen:

Google Fonts Reference

Dazu gehst du (bei Chrome) beim Besuch der Website auf Cookies ablehnen, machst mit der Maus einen Rechtsklick, klickst auf Untersuchen und in dem neuen Fensterchen klickst du auf Sources. Schon siehst du jede Verbindung, die die Website trotz abgelehnter Cookies so herstellt. Not so nice in Datenschutzland.

Wie du Google Fonts auf deine DIVI-Website hochlädst

Das ist so ein bisschen Ka*ki-vertrickt. Standardmäßig wird das nämlich blockiert. Das hat schon seinen Sinn, denn sonst könnte jeder viel zu einfach was bei dir hochladen. Sicherheitslücke und so…

An die Google Fonts kommst du auch ganz easy ran, nämlich direkt bei Google. Einfach deine Schrift auswählen, anklicken und auf Download Family. Entpacken nicht vergessen.

Es gibt mehrere Möglichkeiten, die einfachste ist aber das Plugin Enhanced Media Library. Installieren & aktivieren. Dann gehst du in die Settings und in den Reiter MIME Types. Gib jetzt vorne deine Font-Endung an (.ttf oder .otf oä), gib bei MIME Type was ein und – ganz wichtig – aktiviere das Kästchen Allow Upload.

Speichern nicht vergesse. (Ich hasse es, das sagen zu müssen. Wirklich.)

ENhanced Media Library einrichten

 

Jetzt gehst du auf eine beliebige deiner Webseiten, aktivierst den Pagebuilder, öffnest ein Textmodul, gehst zu Design → Text → Schrift. Hier würdest du jetzt eigentlich eine Schrift einfach auswählen, aber du klickst auf Hochladen. Vergib einen Namen für deine Schrift, wähle die Schrift als .ttf oder .otf von deinem Desktop/Ordner aus und speichern.

Google Fonts in DIVI easy Websiteweit ändern

Wenn du sauber mit Presets gearbeitet hast, geht das ganz schnell.

Nachdem du die Schriften also hochgeladen hast, wechsel in den Theme Customizer.

Hinterlege hier unter Typographie deine neuen Schriften und überall sonst, wo du hier Schriften zuordnen kannst.

Dann wechsel wieder auf eine deiner Seiten, öffne ein Textmodul und bearbeite die Presets. Wie gesagt, wenn alle deine Textmodule mit Presets erstellt wurden, kannst du einfach hier die neue Schrift im Preset hinterlegen und das wars. Wenn du gar nicht mit Modulen, sondern nur mit den Einstellungen im Customizer gearbeitet hast, dann brauchst du disen Schritt gar nicht. Dann steht in all deinen Modulen als Schrift Default (also die Schrift, die du im Customizer gewählt hast).

Wenn nicht, dann wäre jetzt der ideale Zeitpunkt, allen Modulen auf deiner Website Presets zuzuordnen. Mehr zu den Presets erfährst du hier: Tricks & Kniffe für DIVI

Das Plugin danach bitte wieder löschen. So wie alle Plugins, die du nur vorübergehend brauchst.

Google Fonts in DIVI deaktivieren

Geh dazu in die DIVI-Optionen und deaktiviere direkt im ersten Reiter Allgemein die beiden Schalter für die Google Fonts. Wenn du jetzt deine Website anschaust, wirst du merken, ob du sauber gearbeitet hast. Denn alles, was noch von Google geladen wurde, ist jetzt weg.

Google Fonts DIVI

Wird jetzt noch einen Blick in den DIVI-Optionen auf den Reiter Performance, ob hier der Schalter für die Google Fonts deaktiviert ist.

Google Fonts deaktivieren

Es werden immernoch Schriften geladen? Dann such mal nach Plugins oder Formularen, die von externen Anbietern Google Fonts auf deiner Website laden. Dann wirst du sie dort noch deaktivieren müssen (zB Recaptcha oder Codeschnipsel in Newsletter-Formularen).

Thats it.

Onlinemarketingbundle 1

Onlinemarketing-Guides für 0€!

...mit allem, was du über das Slow-Marketing mit Website & Newsletter wissen solltest - ideal für Introvertierte!

Verkaufen durch Vertrauen statt Kaltakquise und Social Media Stress!

Du hast keine Lust, das selbst zu machen? Ich übernehm das.

Hat keine meiner Lösungen funktioniert? Dann schrei(b).

 

13. Januar 2022

Kategorien

Marketing von
Nadin Schmidt

Hi, ich bin Nadin.

Ich bin Nadin und ich verhelfe (introvertierten) Soloselbständigen zu ihrer Wohlfühlsichtbarkeit mit Website und Newslettern.

Am liebsten arbeite ich dafür mit Divi und Active Campaign.

Für mehr „slow“ im Onlinemarketing statt Social Media Stress!

Fragen? Schrei(b).



ALL-INKL.COM - Webhosting Server Hosting Domain Provider

Theme & Pagebuilder: Divi*

*Hierbei handelt es sich um einen Affiliate-Link. Wenn du darüber kaufst, erhalte ich eine kleine Provision – du zahlst dafür nicht mehr.

Lies doch auch mal…