WordPress-Texteditor optimieren

Tipps zur Optimierung des visuellen Editors von WordPressIch habe lange den Visuellen-Editor in WordPress gemieden. Inzwischen setze ich diesen immer häufiger und gerne ein. Das Arbeiten geht schnell von der Hand und hat man sich auf die ein oder andere Eigenheit eingestellt kommt am Ende auch sauberes HTML heraus.
Um noch mehr aus dem Text-Editor raus zu holen, hier einige Tipps und Plugins die das Erstellen von Inhalten vereinfachen.

1. Erweiterung des Visuellen Editors mit dem TinyMCE Advanced Plugin

Mit dem Plugin TinyMCE Advanced lässt sich der visuelle Editor von WordPress um etliche Buttons erweitern. Zum Beispiel auch um die oft vermisste Möglichkeit Tabellen mit Hilfe des visuellen Editors zu erstellen. Nach der Installation kann man unter ‚Einstellungen‚ » ‚TinyMCE Advanced‚ komfortabel den Editor anpassen und um zahlreiche Bedienelemente bereichern. Insgesamt stehen vier Ebenen zur Verfügung die mit Buttons gefüllt werden können.

WordPress-Editor erweitern mit TinyMCE Advanced

Belegung der Buttons in den Plugin-Optionen von TinyMCE Advanced

2. Editor mit eigenen Buttons und Funktionen erweitern

Das Plugin AddQuicktag ermöglicht es den HTML- sowie den Visuellen-Editor von WordPress mit eigenen Buttons und Quicktags zu erweitern. So können wiederkehrende Textbausteine oder Code-Schnipsel leicht in den Editor integriert und zur Verfügung gestellt werden. Im Artikel WordPress-Editor mit eigenen Buttons und Quicktags wird das Plugin kurz vorgestellt.

3. WordPress Editor mit CSS stylen

Gerade für Kundenprojekte lohnt es sich, die eingefügten Elemente im visuellen Editor mit Hilfe von CSS der Optik im Frontend anzupassen. So kann man schon beim Schreiben des Artikels sehen, wie der Beitrag tatsächlich auf der Webseite aussieht.
Um die sichtbaren Elemente im  Editor  von WordPress mit CSS zu stylen, muss folgende Funktion in die functions.php des WordPress-Themes hinzugefügt werden:

// This theme styles the visual editor with editor-style.css to match the theme style.
add_editor_style();

Anschließend eine neue CSS-Datei erstellen und diese mit dem Dateinamen editor-style.css in den Theme-Ordner abspeichern. Nun alle Styles der Artikel-Elemente (Überschriften, Absätze, Links, Bilder, Listen, blockquotes  etc.) übernehmen.  So vermittelt bereits der Editor beim Schreiben einen sehr guten Eindruck wie der Artikel tatsächlich im Frontend aussehen wird.

4. WordPress-Editor: komplexe Inhaltsbereiche benutzerfreundlich pflegen

In dem Artikel WordPress-Editor: komplexe Inhaltsstrukturen benutzerfreundlich pflegen erklärt kulturbanause Jonas, wie man den Editor mit Hilfe der functions.php und die im Tipp 3 erwähnten editor-style.css für die Eingabe komplexer Inhalte aufbereitet. Für jeden der Kundenprojekte mit WordPress realisiert ein absolut empfehlenswerter Beitrag.

WordPress-Editor: komplexe Inhaltsstrukturen benutzerfreundlich pflegen

WordPress-Editor: Inhaltsstrukturen festlegen

5. Größe der Textbox verändern

Um die Größe der Textbox im WordPress-Editor zu verändern, geht man im Backend auf  ‚Einstellungen‚ » ‚Schreiben‚. Im Punkt ‚Größe der Textbox‚ kann die sichtbare Anzahl der Zeilen definiert werden. Standardwert ist 20, ich arbeite mit 30.

Habt ihr weitere Tipps, wie man das Schreiben von Artikel mit dem WordPress-Editor noch komfortabler gestalten kann? Ich freue mich auf Kommentare.

3 Kommentare

  1. Hat sich zu Punkt 5 was geändert. Ich finde keine Einstellmöglichkeit um den Texteditior im Admin Bereich zu vergrößern, so dass ich das nicht ständig händisch machen muss.

Schreibe einen Kommentar

Required fields are marked *.