Software Guide

Ausgangssituation

Wenn man in WordPress einen neuen Artikel schreibt und z.B. auf „Zwischenspeichern“ klickt, so wird die Seite neu geladen und am Ende der Seite wird in einem iFrame die komplette Webseite angezeigt, und diese enthält den bisherigen Artikeltext.
Einerseits ist das toll, weil man 1:1 sieht, wie der Artikel aussehen wird, ob Bilder richtig positioniert sind, etc.

Ein gravierender Nachteil ist jedoch, dass das Laden der Seite dadurch sehr viel Zeit in Anspruch nimmt, es dauert zum Teil „ewig“, bis das Admin-Interface aufgebaut ist, gerade wenn man im Blog externe Dinge wie Adense, Counter, 80×15-Buttons, YouTube-Videos, etc. von extern eingebunden hat.

Außerdem ist es zwar bei DSL-Flatrate egal, wenn immer die komplette Seite inkl. Header, Sidebar, Footer etc. geladen wird, aber es gibt immer noch einige Leute, die per ISDN oder sogar analog angebunden sind.

Ansatz

Es gibt das WordPress-Plugin Kill Preview, das wirft diesen iFrame komplett raus und ersetzt den Skip-Link oben rechts („Springe zur Vorschau“) mit einem Popup-Link, in dem dann die komplette Seite geladen wird.

Mir persönlich wäre es aber lieber, wenn die Vorschau direkt erscheint, nur sollte eben nicht via iFrame die komplette Frontend-Seite geladen. Beispielsweise Mediawiki (Software von Wikipedia) bietet so etwas, dort erscheint in einer Vorschau der Inhalt ohne iFrame.

Lösung

Ich habe daher ein Plugin geschrieben, dass auf dem Kill-Preview-Plugin basiert, aber eine Text-Vorschau im Beitrag bietet. Bilder sagen bekanntlich mehr als 1000 Worte:

Der Bereich kann auf Wunsch auf- und zugeklappt werden. Wie man im Bild sieht, kann die Ausgabe formatiert werden. Dazu erstellt man die Datei style_preview.css im Plugin-Verzeichnis und weist darin dann die wichtigsten CSS-Regeln zu. Man muss jedoch die ID „preview“ voranstellen. Im Folgenden ein Beispiel-Auszug aus einem solchen CSS:

#preview { width: 625px; color: #333; font: 100%/1.5em "Lucida Grande", verdana, helvetica, arial, sans-serif; padding: 0 20px 0 20px; }
#preview a, #preview a:link { color: #43A806; border: 0 none; }
#preview a:visited { color: #43A806; }
#preview strike { text-decoration: line-through; color: #919191; }
#preview a img { border: none; }
#preview  h3 { font-size: 115%; padding: 1em 0 0.3em }

Betatester

Das Plugin funktioniert wunderbar bei mir, jedoch gab es beim Testen einen Konflikt mit dem Plugin „Exec PHP“ (Fehlermeldung von Exec-PHP, die zum Abbruch führt). Ich bin dem allerdings noch nicht weiter nachgegangen.
Da ich im Plugin mit ob_start() (= Ausgabe-Pufferung) arbeite, kann es zu Konflikten mit anderen Plugins kommen. Daher möchte ich mehr über die Praxistauglichkeit erfahren, bevor ich das Plugin offiziell rausbringe.

Deshalb würde es mich freuen, wenn sich ein paar Freiwillige finden, die das Plugin testen möchten und mir entweder hier als Kommentar oder per Email Feedback geben. Ich stelle einfach mal den Download direkt hier rein: Replace Post Preview (zip, 2k)

Installation:

• Wie gewohnt entpacken und ins WordPress-Plugin-Verzeichnis (oder ein Unterverzeichnis vom Plugin-Verzeichnis) hochladen
• Unter WP-Administration > Plugins aktivieren

Damit sollte es schon funktionieren. Um jetzt auch noch die Ausgabe besser zu formatieren, legt Ihr die Datei style_preview.css im Plugin-Verzeichnis ab und formuliert dort die CSS-Regeln, siehe die obige Beschreibung.

So, und nun seid Ihr dran, ich bin über jedes Feedback dankbar :)