Trick # 433 | Dieser Beitrag beinhaltet 561 Wörter. – Geschätzte Lesezeit: ca. 3 Minuten.
Heute zeigen wir Ihnen einen Trick – raten Ihnen aber gleichzeitig auch davon ab. Der interne CSS-Editor in WordPress kann nämlich ab und an ganz gehörig nerven. Er gibt bisweilen auch bei fehlerfreiem CSS-Code Warnungen aus und verhindert das Speichern des Codes. Es gibt einen Weg, die Funktion zu deaktivieren; ganz ohne ist das aber nicht.
Wenn Sie CSS über den WordPress-Customizer bearbeiten, kann es vorkommen, dass moderne Funktionen (wie etwa CSS-Variablen) als Fehler markiert werden, obwohl diese in modernen Browsern korrekt interpretiert werden. Das liegt an der Syntaxprüfung des integrierten Editors, die nicht immer mit den neuesten Webstandards Schritt hält. In diesem Artikel zeigen wir Ihnen, wie Sie diese Fehlerprüfung deaktivieren können, mahnen aber gleichzeitig zur Vorsicht.
Wenn Sie sich der Sache sicher sind, können Sie die Syntaxprüfung des CSS-Editors mit einem kleinen Code-Snippet komplett abschalten. Fügen Sie diesen Code in die functions.php Ihres Child-Themes ein – unter Design/Theme-Editor:
// CSS-Fehlerprüfung deaktivieren
add_action('customize_controls_print_footer_scripts', function() {
echo "<script>
wp.customize.previewer.bind('preview-ready', function() {
var editor = wp.codeEditor.defaultSettings.codemirror;
if (editor) {
editor.options.lint = false; // Syntaxprüfung deaktivieren
}
});
</script>";
});
Der integrierte WordPress-Editor bleibt mit diesem Snippet aktiv und ebenfalls die Fehlerprüfung bloss ist das Speichern des Stylesheets auch möglich, wenn es Fehler enthält. Damit kann falsche CSS-Syntax nun unbemerkt bleiben (z. B. fehlende geschweifte Klammern). Stellen Sie sicher, dass Ihr Code korrekt ist, um Anzeigeprobleme auf Ihrer Website zu vermeiden.
Die Deaktivierung der Fehlerprüfung im WordPress-Customizer kann eine Erleichterung sein, wenn Sie moderne CSS-Techniken verwenden. Dennoch sollten Sie vorsichtig vorgehen und sicherstellen, dass Ihr CSS-Code wirklich korrekt ist. Nutzen Sie diesen Ansatz also nur, wenn Sie sich mit CSS auskennen, und testen Sie Ihre Änderungen gründlich, um Fehler auf Ihrer Website zu vermeiden.
Alternative: CSS-Stylesheet des Child-Themes verwenden
Bis WordPress die neuere CSS-Syntax erkennt und diese nicht mehr als Fehler brandmarkt, kann es noch eine Weile dauern. Alternativ zum oben genannten Hack können Sie die fraglichen Teile Ihres CSS-Codes auch in das Stylesheet eines Child-Themes verlagern. Dieses finden Sie unter Design/Theme-Datei-Editor.
Dort gibt es ebenfalls eine Fehlerprüfung, diese lässt sich aber mittels eines Klicks in die angezeigte Checkbox übersteuern. Alltägliche CSS-Stylings sollten Sie dennoch besser weiterhin unter Design/Customizer/Zusätzliches CSS eintragen.
Werbung