Custom CSS
Custom CSS (benutzerdefiniertes CSS) ermöglicht es, das Erscheinungsbild einer WordPress-Website anzupassen, ohne Theme-Dateien direkt zu bearbeiten. CSS (Cascading Style Sheets) steuert Farben, Schriftarten, Abstände, Layouts und alle visuellen Aspekte. Eigenes CSS wird auf bestehende Theme-Stile angewendet und überschreibt sie gezielt.
Wo Custom CSS in WordPress hinkommt
- Customizer – Darstellung → Customizer → Zusätzliches CSS. Das ist der empfohlene Weg für kleine Anpassungen. Das CSS wird in der Datenbank gespeichert und bleibt bei Theme-Updates erhalten.
- Child Theme – eigene
style.cssim Child Theme. Empfohlen für größere Mengen CSS oder strukturierte Anpassungen. Sauberste Lösung für professionelle Setups. - Block Editor – jeder Block hat ein CSS-Klassen-Feld, über das Custom CSS-Klassen zugewiesen werden können
- theme.json – in Block Themes wird das Design-System über JSON konfiguriert, kein CSS mehr nötig
- Plugins – manche Page Builder haben eigene CSS-Felder (Elementor, Divi, Kadence)
Warum nicht direkt in die Theme-Dateien
CSS-Änderungen direkt in style.css des aktiven Themes werden bei Theme-Updates überschrieben. Deshalb immer: Customizer für kleinere Anpassungen, Child Theme für umfangreichere Änderungen. Nur in Child Themes ist direktes Bearbeiten von Theme-Dateien sicher.
CSS-Spezifität und Override-Probleme
CSS funktioniert nach dem Spezifitätsprinzip: Spezifischere Selektoren gewinnen gegenüber allgemeineren. Wenn Custom CSS nicht wirkt, liegt es oft an höherer Spezifität des Theme-CSS. Lösung: Spezifischeren Selektor verwenden (z.B. .site-header .nav-menu statt .nav-menu), oder als letztes Mittel !important – das aber sparsam einsetzen, da es das Debugging erschwert.
