Ein Leser stellte mir per E-Mail die Frage, wie man in WordPress das CSS anpassen kann. Wo sind die Dateien, wie passt man sie an und wie kann man sie verändern. Falls Sie sich das auch fragen – vielleicht hilft meine Antwort ein bisschen weiter.
Inhaltsverzeichnis
- Wie ändert man das CSS in WordPress?
- Wo sind die Files?
- CSS und Block-Themes
- Einstieg in HTML und CSS
Wie ändert man das CSS in WordPress?
Was mir am meisten fehlt ist eine Anleitung, wie man CSS in WordPress verändert.
Das HTML und zum großen Teil auch das CSS für das Frontend wird von WordPress automatisch erzeugt, genau genommen vom aktiven Theme.
Wenn Sie es gewohnt sind, für Ihre Websites den Code selbst zu schreiben, ist das ein echter Paradigmenwechsel, denn die Stellschrauben sitzen ganz woanders.
Wo sind die Files?
Wo die Files sind, wie sie angepasst, verändert werden können. Nicht generell CSS, sondern das CSS bei WordPress.
Dabei gibt es große Unterschiede zwischen klassischen Themes und Block-Themes.
CSS anpassen in klassischen Themes
In klassischen Themes war es durchaus üblich, zur Anpassung des Themes, eigenes CSS zu schreiben. Die dazu benötigten Selektoren variieren von Theme zu Theme, aber mit einem Blick in den Quelltext findet man sie relativ schnell.
Für kleinere Änderungen gab es im Customizer einen Bereich namens Zusätzliches CSS, für größere erstellte man ein Child-Theme und speicherte die Änderungen in der style.css des Child-Themes.
CSS anpassen in Block-Themes
Block-Themes haben als Ziel die Anpassung der Website ohne Eingriffe in den Code zu ermöglichen, und das gilt auch für das CSS.
In einem Block-Theme besteht alles aus Blöcken, und die Anpassung der Website erfolgt im Website-Editor. Dort kann man im Bereich Stile die Gestaltung der Blöcke definieren. Das dazu benötigte CSS erzeugt WordPress automatisch.
Auch in Block-Themes gibt es im Website-Editor im Bereich Stile noch die Option Zusätzliches CSS, und man könnte auch noch ein Child-Theme mit einer style.css erstellen, aber diese Optionen sind deutlich weniger wichtig als noch bei klassischen Themes und bei Block-Themes nicht im Sinne des Erfinders.
CSS und Block-Themes
Der WordPress-Entwickler Fränk Klein aus Luxemburg erklärt in diesem gut sechs-minütigem Video, warum Block-Themes in Bezug auf CSS eine gute Idee sind:
- Kaum noch externe Stylesheets, die das Laden der Seite blockieren.
- Kaum noch ungenutztes CSS, da nur das CSS für die vorhandenen Blöcke geladen wird.
In English, aber kurz, knapp und gut.
Einstieg in HTML und CSS
Gibt mir Ihr Buch »Einstieg in HTML und CSS (2024)« darauf Antwort?
Nein. Das Buch Einstieg in HTML und CSS ist eine Einführung in modernes HTML und CSS. WordPress spielt dabei keine Rolle.
Aber das Verstehen von modernem HTML und CSS erleichtert die Gestaltung von Blöcken im Website-Editor, auch wenn man den Code nicht mehr selbst schreibt.
Beitragsbild von Nick Karvounis on Unsplash
Schreibe einen Kommentar