Bekommen, was man sieht: Der visuelle Texteditor von WordPress

—Update: März 2017—

Wir haben Euch bereits hier im Blog gezeigt, wie einfach Ihr als WordPress-Nutzer Eure Blogartikel formatieren und strukturieren könnt. Möglich wird das durch den visuellen Texteditor von WordPress, der nach dem WYSIWYG-System funktioniert: What You See Is What You Get. In diesem Beitrag gehen wir ins Detail und stellen Euch den visuellen Texteditor ganz genau vor.

Der Texteditor ermöglicht ein weitgehend intuitives Gestalten und Bearbeiten Deiner Texte. Dieser Text liefert Dir Informationen und Anleitungen

  • zur Werkzeugleiste
  • zu Formatierung und Ausrichtung
  • zu Tastaturkürzeln für eine noch schnellere Bedienung.

Rich Editing/WYSIWYG – was Du davon hast

WYSIWYG wird auch als Rich Editing bezeichnet. Einfach ausgedrückt bedeutet es, dass Dein Text durch den Rich Editor so formatiert wird, wie Du ihn tippst. Der Rich-Editor erzeugt dafür im Hintergrund einen HTML-Code (HTML steht für Hypertext Markup Language – eine Programmiersprache, mit der Dokumente für das Web erstellt werden können). Für Dich bedeutet das: Du kannst Dich ganz aufs Schreiben konzentrieren und musst Dir wenig Gedanken um die Technik machen.

Tipp: Wenn Ihr wissen möchtet, was da so alles im Hintergrund läuft, stellt Euren Editor von „Visuell“ auf „Text“ um (die entsprechenden Buttons finden sich rechts oben an der Textbox).

Die Werkzeugleiste

Die Werkzeugleiste befindet sich oberhalb der Texteingabebox und umfasst zwei Zeilen. Solltet Ihr nur eine Zeile sehen, geht Ihr auf das tastaturähnliche Symbol, dem Icon für Werkzeugleiste verstecken/Werkzeugleiste zeigen – die zweite Zeile klappt sich aus.

Werkzeugleiste Texteditor WordPress
Die ausgeklappte Werzeugleiste im Texteditor Screenshot: WordPress Backend

Die Werkzeugleiste unter die Lupe genommen

Welches Icon steht für welche Funktion? Mit unserer Übersicht werden alle Fragen geklärt:

Werkzeugleiste im Detail
Screenshot: WordPress Backend
  1. Absätze einfügen (Zwischentitel in verschiedenen Größen etc.)
  2. Bold / Fett
  3. Kursiv
  4. Aufzählung mit Bulletpoints
  5. Aufzählung in numerischer Reihenfolge
  6. Zitat (ein Zitat wird dadurch eingerückt und im Text hervorgehoben – auch eine Möglichkeit für die optische Auflockerung eines Blogartikels)
  7. Ausrichtung nach links
  8. Zentrierte Ausrichtung
  9. Ausrichtung nach rechts
  10. Link einfügen / ändern (bspw. ob beim Klick ein neues Fenster geöffnet werden soll)
  11. Link entfernen
  12. Weiterlesen-Link setzen
  13. Detaillierte Werkzeugleiste ausklappen / verstecken
  14. Text durchstreichen
  15. Horizontale Linie unter den Text einfügen
  16. Textfarbe ändern
  17. Text einfügen (sollte beim Einfügen von Texten aus Microsoft Word nicht aktiviert sein)
  18. Formatierungen entfernen
  19. Sonderzeichen einfügen
  20. Text nach links einrücken
  21. Text nach rechts einrücken
  22. Rückgängig machen
  23. Schritt wiederholen
  24. Tastaturkürzel für Formatierungen

Aufzählungen – für alle Listenfreunde

Die beiden Aufzählungs-Icons werdet Ihr vermutlich relativ häufig benutzen. Denn Listen sind ein wichtigstes Stilmittel für Webtexte. Sie helfen Euch, einen Text übersichtlich zu gliedern und machen ihn auch für Schnellleser einfach erfassbar.

Wie bei einem Textverarbeitungsprogramm solltet Ihr auch in WordPress die vorgesehenen Icons verwenden – nutzt Ihr stattdessen Spiegelstriche, sieht das vielleicht noch im Editor okay aus. Spätestens beim Veröffentlichen werdet Ihr aber merken, dass dadurch Textpassagen verrutschen können.

Ausrichtung und Blocksatz

Mit der Version 4.7 ist das Formatierungssymbol für den beliebten Blocksatz verschwunden. Die Funktion aber natürlich nicht. Es gibt aktuell mehrere Möglichkeiten, wie Ihr Absätze in Blocksatz formatieren könnt:
1.) Ihr markiert den Absatz und nutzt die Tastenkombination „Shift+ALT+j“
2.) Ihr schaltet in den  Texteditor und nutzt <p style=“text-align: justify;“>
3.) Ihr erweitert Euren visuellen Editor bspw. mit dem Plugin TinyMCE Advanced

Solltet Ihr Euch für den Blocksatz entscheiden, müsst Ihr dabei auf eine Sache aufpassen: Es steht Euch in WordPress keine Silbentrennung zur Verfügung. Im Blocksatz kann es deshalb sehr große Lücken zwischen den einzelnen Worten geben, was nicht wirklich gut aussieht und auf Kosten der Lesbarkeit gehen kann.

Videos einbetten

Bewegte Bilder werden für Blogs ein immer wichtigeres Element. Als WordPress-Nutzer habt Ihr die Möglichkeit, Videos von verschiedenen Plattformen in Eurem Blog einzubetten. Dafür geht Ihr zum Beispiel auf YouTube, sucht Euch da das gewünschte Video heraus und geht dann auf den Button „Teilen“:

Nachdem Du "teilen" angeklickt hast, öffnet sich ein neues Fenster. Hier musst Du "einbetten" anwählen.
Nachdem Du „teilen“ angeklickt hast, öffnet sich ein neues Fenster. Hier musst Du „einbetten“ anwählen. Screenshot: S. Cantzler

Fügt Ihr diesen Link in Euren Texteditor ein, wird automatisch das Video eingebunden.

Schneller Zugriff: Tastaturkürzel

Mit Tastaturkürzeln klappt das formatieren oft schneller als per Maus – zumindest, sobald man sich die Kürzel komplett gemerkt habt. Auch für sämtliche Funktionen des visuellen Editors gibt es solche schnellen Griffe.

Headlines könnt Ihr zum Beispiel mit den Kombinationen strg bzw. cmd (für Macs) plus 1, 2 oder 3 erzeugen.

Mit strg/cmd plus c wird kopiert, mit plus b gefettet, mit plus z widerrufen. Einen vollständigen Überblick über alle Kürzel erhaltet Ihr über das Hilfe-Icon im Editor unter dem Fragezeichen.

So, damit habt Ihr den visuellen Texteditor und seine wichtigsten Funktionen kennengelernt. Ich hoffe, die Infos helfen Euch weiter und machen Euch das Schreiben leichter. Wenn noch Fragen offen geblieben sind, meldet Euch gerne bei uns – wir freuen uns über Eure Anregungen!

Einfache Suchmaschinen-Optimierung

Mit unserem Rankingcoach sind Sie in der Lage einfach und schnell SEO für WordPress durchzuführen

Rating: 3.6/5. Von 7 Abstimmungen.
Bitte warten...

9 Gedanken zu „Bekommen, was man sieht: Der visuelle Texteditor von WordPress

  1. Hallo, ich hatte das gleiche Problem. Da kann ich nur Danke sagen. Habe lange nach der Problemlösung gesucht. Super Hilfe!!!

  2. Ich würde gerne wissen, wo das Symbol für „Blocksatz“ geblieben ist. Es gibt die linke, zentrierte und rechte Ausrichtung. Der Blocksatz fehlt.

    1. Katja

      Hi Antoni,
      das Symbol ist tatsächlich mit der Version 4.7 verschwunden – die Funktion aber natürlich nicht. Es gibt aktuell mehrere Möglichkeiten, Deine Absätze in Blocksatz zu formatieren:
      1.) Du markierst Deinen Absatz und nutzt die Tastenkombination „Shift+ALT+j“
      2.) Du schaltest in den Texteditor nutzt <p style=“text-align: justify;“>
      3.) Du erweiterst Deinen visuellen Editor bpspw. mit dem Plugin TinyMCE Advanced

  3. Ich habe ein Problem mit dem WP Editor. Neuerdings werden mir weder Buttons , noch die Reiter „Text ,Visual“ angezeigt.
    WP Edit ist in der Version 3.7 installiert. Selbst wenn ich die ältere Version 3.5 installiere, erscheinen die Buttons nicht mehr. Der Cache wurde mehrfach geleert. Sämtliche Plugins wurden deaktiviert. Dennoch bleibt der Editor beharrlich im HTML – Modus und läßt keinen anderen zu.
    Wie bekomme ich die Reiter „Text / Visual“ im Editor dauerhaft zurück?
    Bin Neuling und habe mich bislang noch nicht mit WP befasst.

    1. Arne

      Hi Hans,

      das Problem tritt im Regelfall auf, wenn eine zu alte PHP-Version genutzt wird. Prüfe das am Besten einmal bei deinem Hosting und ändere die PHP-Version mindestens auf 5.4.

      Gruß Arne

    2. Hallo nochmal.
      Derweil ist PHP Version 5.6.17 und MySQL 5.6.27 installiert. Also schon höher als 5.4.
      Dennoch nichts zu sehen von den Buttons.

    3. Arne

      Hi Hans,

      höher ist nicht zwingend besser. Teste es einmal mit 5.4. Ansonsten schaue mal in den Serverlog, wenn du die Möglichkeit dazu hast, ob dort ein Fehler zu finden ist. Ohne mehr Info´s kann ich da leider nur noch raten.

      Gruß Arne

    4. Hallo Arne
      Habe den Fehler gefunden. Im Profil war unter „Persönliche Optionen“ bei Visueller Editor
      „Beim Schreiben den WYSIWYG-Editor nicht benutzen“ der Haken gesetzt.
      Damit war nur noch Texteingabe möglich. Nachdem ich den Haken dort entfernt habe, ist alles wieder
      so vorhanden, wie es zuvor gewesen ist. Habe wahrscheinlich einfach mal Häkchen gesetzt und dann
      nicht mehr gewußt wo.
      Jedenfalls Danke und Gruß Hans

  4. Gibt es eine Möglichkeit, das (in meinen Augen restlos bescheuerte, weil überflüsige und störende) Pop-up zu unterdrücken, das im Modus »Visuell« dem Anwender unablässig mitteilt, dass er sich im »Rich Text-Bereich« befindet?
    Vielen Dank für jeden Tipp (und jeden Hinweis, der zur Ergreifung des verantwortlichen Programmiers führt, der sich diesen Unsinn ausgedacht hat …)

Schreibe einen Kommentar

Die von Ihnen hier erhobenen Daten werden gemäß unserer Datenschutzerklärung zur Veröffentlichung Ihres Kommentars in unserem Blog verarbeitet.