Brack & Hoffmann Werbeagentur Halle / Saale

Webseiten mit WordPress

Navigation WordPress:
Inhalt WordPress:

Das TinyMCE Clear-Plugin

Screenshot

TinyMCE Clear - Die drei zusätzlichen Schaltflächen

Wer Seiten sauber und XHTML-konform formatieren will, kommt um dieses Plugin nicht herum. Das Problem, vor dem man oft steht: ein links- oder rechtsbündiges Bild, der umfließende Text ist weniger hoch als das Bild. Um weiteren Text unter dem Bild einzufügen, werden mit der Entertaste mehrere aufeinanderfolgende Absätze oder mit Shift + Enter mehrere aufeinanderfolgende Umbrüche eingefügt. Erst dann kann unter dem Bild weitergeschrieben werden.

Voraussetzung dafür ist die Verwendung des Plugins TinyMCE Advanced, wobei der Haken bei der Option

Stop removing the <p> and <br /> tags when saving and show them in the HTML editor

gesetzt werden muss.

Anders sieht es bei mehreren nebeneinanderstehenden Bildern aus. Linksstehende Bilder werden links ausgerichtet, für das letzte Bild der Reihe wird als Ausrichtung “keine” angegeben. Dann kann auch ohne zusätzliche Absätze und Umbrüche unter dem Bild weitergeschrieben werden.

Das Problem besteht aber wieder beim Element “Bild mit Bildunterschrift”. Hier bietet WordPress wirklich eine ausgezeichnete Möglichkeit, ein Bild mit einer Bildunterschrift auf der Seite zu platzieren. Allerdings führt die oben genannte Option im TinyMCE Advanced dazu, dass nach jedem Speichern ein zusätzlicher Absatz über dem Element automatisch eingefügt wird (siehe TinyMCE Advanced). Mehrere dieser Elemente lassen sich so nicht vernünftig nebeneinander platzieren.

Und hier kommt TinyMCE Clear ins Spiel.

Um eine Seite sauber XHTML-konform zu formatieren, darf die genannte TinyMCE Advanced-Option nicht gewählt werden. Die Abstände zwischen Absätzen müssen mit CSS definiert werden.

Was macht jetzt dieses Plugin?

Es fügt in den Editor drei Schaltflächen ein. Beim Klick darauf wird ein Absatz mit dem Stylesheet clear:left, clear:both oder clear:right nach dem Bild eingefügt.

Beispiel: ein Bild wird in die Seite eingefügt und links ausgerichtet. Der nebenstehende Text wird eingefügt. Ist der Text weniger hoch als das Bild, wird die Schaltfläche clear:left geklickt. Jetzt kann unter dem Bild weitergearbeitet werden.

Link zur Plugin-Seite

Download von WordPress.org

Ausgewählte WordPress-Plugins