WordPress – Einstellung der Fontsize des Text-Editors

WordPress 3.x (x >= 2) nutzt den MS Consolas Font im Text-Editor. Hier meine ich den Minimal-Editor, in dem man selbst HTML/CSS-Befehle eingeben kann und nicht den Visual Editor..

Der Consolas TTF-Font sieht unter Linux nach meinem Dafürhalten nicht besonders gut aus. Hinzu kommt, dass die von WordPress eingestellte Standard-Font-Größe des Minimal-Editors auf meinen hochauflösenden Laptopschirmen einfach zu klein ist. “Ctrl +” im Browser hilft auch nicht wirklich, da dann alle Bereiche der Seite vergrößert werden und das Editor-Fenster zu klein wird.

Nun weiß man, dass das eine Einstellungssache ist. Aber welches CSS-File muss man editieren ? Für die Style-Vorgaben der generierten Webseiten und auch für die Styles des Visual-Editors gibt es unter dem Menüpunkt Design den Editor, mit dem man die zugehörigen CSS-Dateien online bearbeiten kann. Für die CSS-Files, die das Layout der Admin- oder Redakteurs-Oberfläche steuern, habe ich dagegen keine einfache Bearbeitungsmöglichkeit gefunden.

Zu meiner Überraschung erwies sich eine Suche im Internet bzgl. entsprechender Hinweise als wahre Odyssee. Es gibt zwar Hinweise, aber die meisten sind veraltet. Daher an dieser Stelle ein paar Hinweise:

Die CSS-Steuerung der verschiedenen Seiten und Elemente der Admin-Oberfläche erstreckt sich inzwischen über eine Vielzahl von Dateien, die in folgendem Verzeichnis liegen:

wp-admin/css

Nun möchte man meinen, dass man da was Passendes finden würde. Falsch gedacht !

Ich habe dann in einem Verzweiflungsanfall die CSS-Analyse-Tools von FF benutzt, um den CSS-Klassennamen für das Textarea-Feld im Editor-Bereich zu finden, und mich danach auf die Suche nach Eintragen in CSS-Dateien in mehreren Verzeichnissen gemacht. Fündig wurde ich schließlich in folgendem File :

wp-includes/css/editor.min.css

Vor weiteren Aktionen legt man nun eine Sicherungskopie dieser Datei an. Nun ist dieses File nicht ganz leicht zu editieren, da alle CSS-Anweisungen in eine einzige lange, komprimierte Zeile geschrieben wurden. Manche Editoren mögen die entstehenden Zeilenlängen nicht. Aber man setze z.B. in Kate die erlaubte Zeilenlänge auf 300000 Characters und schon ist man wieder im Spiel. Nun gilt es die Anweisungen für

.wp-editor-container    textarea.wp-editor-area

zu finden. Dort fügt man dann die gewünschte “font-size” und “font-family” hinzu. Und schon sieht der WordPress Text-Editor wieder so gut aus wie in alten Zeiten.

wp_1_600

Andere Alternativen zur Abänderung der CSS-Vorgaben bestehen darin, eine Inline-Style-Vorgabe in die Datei

wp-admin/post.php

beim Textarea-Feld einzufügen. Oder man arbeite mit dem netten Plugin “Add Admin CSS” und gebe dort die Vorgaben für “.wp-editor-container    textarea.wp-editor-area” im gewöhnlichen CSS-Format ein. Letztere Methode hat auch den Vorteil, dass sie evtl. WordPress-Updates überlebt.

Denn eine Abkehr von der aktuellen CSS-Politik und einen Veränderung der Position und Namen der Files, die das Layout steuern, kommt mit Sicherheit eher früher als später. Bis dahin jedenfalls weiter viel Spass beim Bloggen!