p +49 6206 9462690

WordPress Backend CSS Trick

Ein großes Problem bei der Gestaltung von komplexen Layouts innerhalb des WordPress Content Bereiches ist die unterschiedliche Darstellung im WYSIWYG Editor (Backend) und auf der Webpräsenz selbst (Frontend). Zum Glück kann man mit einem einfachen Trick schnell Abhilfe schaffen.

Hierzu fügt man der functions.php im Theme Verzeichnis folgenden Code hinzu:

add_editor_style('style.css');
add_editor_style('backend.css');

Dabei wird das Stylesheet des Themes im Backend geladen und der Inhalt im WYSIWYG Editor dementsprechend formatiert. Den Pfad zu den entsprechenden CSS Dateien gibt man relativ ab dem Speicherplatz der functions.php an. In dem hier gezeigten Fall liegt die style.css also im gleichen Ordner wie functions.php.

Um Hintergründe oder Linkfarben innerhalb des WYSIWYG zu ändern, kann eine zweite CSS Datei eingebunden werden. Hier ein Auszug der hier verwendeten backend.css.

#tinymce { background: none; margin:10px; }

Related Posts