Schriftgrößen nachträglich per CSS ändern – auch in Divi
Manchmal passt die Schriftgröße einer Website nicht mehr zum aktuellen Design oder zur Lesbarkeit – besonders bei älteren Seiten.
Mit gezielten CSS-Regeln lassen sich Schriftgrößen nachträglich ändern, ohne Inhalte neu anzufassen oder Layouts umzubauen.
Warum Schriftgrößen nachträglich angepasst werden müssen
Gerade bei Websites, die über Jahre gewachsen sind, kommt es häufig vor, dass:
-
Texte zu klein oder zu groß wirken
-
unterschiedliche Schriftgrößen uneinheitlich erscheinen
-
ein Redesign geplant ist, aber Inhalte bestehen bleiben sollen
Anstatt jeden Text manuell zu ändern, ist CSS oft der schnellste und sauberste Weg, um konsistent Anpassungen vorzunehmen.
Grundprinzip: Schriftgrößen mit CSS steuern
CSS erlaubt es, Schriftgrößen gezielt für bestimmte Elemente festzulegen, zum Beispiel für:
-
Überschriften (H1–H6)
-
Fließtext
-
bestimmte Bereiche oder Module
-
einzelne Seiten oder Templates
So lassen sich Änderungen zentral steuern und jederzeit wieder anpassen.
Beispiel: Schriftgrößen global ändern
h1 {
font-size: 36px;
}
h2 {
font-size: 28px;
}
h3 {
font-size: 22px;
}
Fließtext ändern
body {
font-size: 18px;
}
Schriftgrößen gezielt für Divi ändern
Divi versieht viele Elemente mit eigenen Klassen. Damit lassen sich Schriftgrößen sehr gezielt steuern.
Textmodule anpassen
.et_pb_text {
font-size: 18px;
}
Menüschrift ändern
.et-menu a {
font-size: 16px;
}
So lassen sich Navigation, Footer oder bestimmte Module unabhängig voneinander optimieren.
Nur bestimmte Seiten oder Bereiche ändern
Wenn die Änderung nicht global, sondern nur auf einzelnen Seiten gelten soll, kann man z. B. die Seiten-ID nutzen:
.page-id-123 h2 {
font-size: 26px;
}
Wo wird der CSS-Code eingefügt?
Je nach Einsatzzweck gibt es mehrere sinnvolle Möglichkeiten:
-
Customizer → Zusätzliches CSS
(ideal für globale Änderungen) -
Divi Theme Options → Custom CSS
-
Code-Modul in Divi
(für seitenbezogene oder testweise Anpassungen) -
Child-Theme, wenn dauerhaft und projektübergreifend gearbeitet wird
Hinweis zu Divi 4 und Divi 5
Die gezeigten CSS-Regeln funktionieren sowohl mit Divi 4 als auch mit Divi 5.
Gerade bei der Umstellung auf Divi 5 ist CSS eine gute Möglichkeit, bestehende Schriftkonzepte zu optimieren, ohne jedes Modul einzeln anfassen zu müssen.
Fazit
Schriftgrößen lassen sich auch nachträglich sehr gut per CSS anpassen.
Mit wenigen Regeln kann die Lesbarkeit deutlich verbessert und das Design vereinheitlicht werden – schnell, flexibel und jederzeit rückgängig.