WordPress Editor Style

Bildschirmfoto 2013-05-06 um 21.38.04Der Text-Editor bei WordPress ist eine etwas abstrakte Sache. Zwar sieht man die Formatierung, aber ohne ein bisschen Eigeninitiative werden Schriftarten und Farben aus dem Frontend beim Schreiben nicht übernommen. Ein richtiger WYSIWYG-Editor ist aber dennoch etwas anderes. Das lässt sich auf relativ einfache Weise nachrüsten.

Zunächst müssen wir das aktuelle Theme Editor-Style-fähig machen. Dazu öffnen wir die Datei functions.php aus dem Theme-Ordner. Diese enthält im oberen Bereich höchstwahrscheinlich eine Funktion function NameDesThemes_setup(). Dort fügen wir irgendwo zwischen den geschweiften Klammern die Zeile

add_editor_style();

hinzu. Diese bewirkt folgendes: Ist im Theme-Ordner neben der style.css auch eine Datei namens editor-style.css vorhanden, so wird diese auf den visuellen Text-Editor im Backend von WordPress angewandt.

Der zweite Schritt ist jetzt ganz einfach: Es muss nur noch die erwähnte Datei editor-style.css angelegt werden. Sie muss im gleichen Verzeichnis wie die style.css liegen. Alle Post-relevanten Styles aus der style.css können dort hinein kopiert werden. Damit man am Ende auch wirklich alles genauso sieht wie später im Frontend auf der Webseite, ist es wichtig, dass alle Textelemente übernommen werden, auch .pre, .blockquote usw.

Ich persönlich übernehme oft nur Schriftarten und Texteffekte, da es sich schwarz auf weiß besser schreibt, als auf einem dunklen Hintergrund. Letztendlich geht es ja mehr um die Optik in dem Sinne, dass man wissen möchte, wo die Zeile zuende ist, wenn die Schrift eine bestimmt Größe hat, oder etwas in dieser Art. Aber da ist sicher jeder anders.