Teil 2: Tiny-MCE in PHP-Projekten
- Tiny-MCE in PHP-Projekten
- Teil 2: Tiny-MCE in PHP-Projekten
- Teil 3: Tiny-MCE in PHP-Projekten
Themes und Plug-ins Tiny-MCE unterstützt Themen (Themes) und Plug-ins, die eine sehr modulare Konfiguration erlauben. Sie können auch Themen selbst entwickeln und so schnell zwischen unterschiedlichen Konfigurationen umschalten. Des Weiteren bietet die integrierte Plug-in-Schnittstelle die Mögl...
Themes und Plug-ins
Tiny-MCE unterstützt Themen (Themes) und Plug-ins, die eine sehr modulare Konfiguration erlauben. Sie können auch Themen selbst entwickeln und so schnell zwischen unterschiedlichen Konfigurationen umschalten. Des Weiteren bietet die integrierte Plug-in-Schnittstelle die Möglichkeit, Tiny-MCE um fehlende Funktionen zu erweitern. Dabei werden schon etliche Plug-ins im Paket mitgeliefert, weitere Tools von Drittanbietern findet man auch auf speziellen Sourceforge-Seiten.
Einige interessante Vertreter der Gattung seien kurz vorgestellt: Wird Tiny-MCE in einer Forums-Umgebung eingesetzt, sind die Plug-ins emotions und BBCode hilfreich, mit diesen können Smileys im Text eingefügt und BBCode benutzt werden. Mit fullpage können Sie eine komplette HTML-Seite mit head- und body-Bereich editieren. Normalerweise wird HTML-Code, der nur eingebettet werden kann, ohne <head> oder <body>-Tag ausgegeben.
Interessant ist ebenfalls das Plug-in media - mit diesem können Sie Mediendaten für Player wie Quicktime, Flash, Shockwave, Realplayer und Windows Media Player einbinden. Plug-is wie print oder searchreplace beschreiben sich schon durch ihren Namen. Der spellchecker allerdings ist eine schlaue Software - zur Rechtschreibprüfung greift sie per Ajax entweder auf eine entsprechend zur Verfügung gestellte PHP-Seite mit PSpell/ASpell-Unterstützung zu - oder auf den Google-Spellchecker.
Aber auch die Tools auf der Sourceforge-Seite können sich sehen lassen. Hier gibt es Plug-ins vom PHP basierten Filemanager mit Upload-Möglichkeit, mehrere Bildverwaltungs- und Clipart-Tools, CSS-Editoren, Syntax-Highlighter, Blogger-Anbindungen, diverse Anpassungen nationaler Spezifikas bis hin zur Einbettung von Youtube-Videos. Die Suche nach TinyMCE und Plug-in fördert mehr als 3100 Ergebnisse auf Sourceforge zutage - da sollte für jeden etwas Passendes zu finden sein.
Konfiguration
Über die erwähnten Optionen, die der Initialisierungsroutine als Javascript-Object mitgegeben werden, lässt sich der Editor sehr fein einstellen. Dies kann an dieser Stelle allerdings nicht bis ins Detail ausgeführt werden. Auf den Seiten des Anbieters gibt es weiterführende Beispiele, die Sie auch direkt testen können.
Ebenfalls lässt sich Tiny-MCE problemlos lokalisieren. Zum einen gibt es eine große Auswahl an Paketen zur Einbindung unterstützter Sprachen auf der Sourceforge-Seite, zum anderen ist gut erläutert, welche Dateien die lokalisierbaren Daten enthalten. So kann man im Zweifelsfall selbst Hand anlegen.
Das Konzept der Konfiguration des Editors ist eigentlich immer gleich: Ein Thema kann die Grundeinstellung vorgeben, dann werden die zu ladenden Plug-ins angegeben, und danach die Buttons, die in der Oberfläche zu sehen sein sollen. Im Anschluss daran kommen einige Einstellungen der Oberfläche sowie einzelne Optionen, die entweder die Plug-ins konfigurieren oder Detaileinstellungen vornehmen. Somit lässt sich Tiny-MCE sehr genau und straff an die eigenen Wünsche anpassen. Daher werden wir im weiteren Verlauf des Artikels noch auf einige Optionen eingehen.
Die aktuelle Version erhält einige neue praktische Features. Das Wichtigste ist der neue readdonly- Modus, in dem Tiny-MCE die Inhalte nur darstellt - Änderungen sind blockiert. Dies ist hilfreich, wenn man eine Anzeige von der reinen Darstellung in den Editor-Modus umschalten möchte. Bisher musste man dazu den Inhalt in ein anderes DOM-Element schreiben, das sich um die formatierte Darstellung kümmerte.
Team-Arbeit
Die sehr genaue Einstellbarkeit der Parameter von Tiny-MCE macht den Editor im Einsatz mit CM-Systemen besonders wertvoll. Hier kommt es häufig vor, dass Content-Redakteure der unterschiedlichsten Bereiche an Texten arbeiten, und wenn dann alle Optionen möglich sind, wird jeder nach seinem Gusto die Inhalte gestalten. Deshalb ist es ratsam, durch Corporate-Identity- Vorgaben nur diejenigen Formatierungsmöglichkeiten zuzulassen, die auch erwünscht sind.
Auch der erzeugte Inhalt lässt sich in bestimmten Grenzen kontrollieren. Mit der cleanup-Option, die zu diesem Zweck immer aktiv sein sollte, überprüft die Software beim Editieren und Sichern den Text. So sind die Optionen valid_elements, unvalid_elements und extended_valid_elements hilfreich - hier können Sie festlegen, welche HTML-Elemente und Tags im Text vorkommen dürfen. Dabei ist es am einfachsten, unter valid_elemts alle gemeinsam gültigen, erlaubten Elemente zu notieren und dann User abhängig über extended_elemts die individuelle Anpassung vorzunehmen.
Um dem Wysiwyg-Anspruch gerecht zu werden, muss die CSS-Datei, die den Inhalt später mit den Style-Informationen verknüpft und ins Layout setzt, in der Option content_css eingetragen werden. Sind dann über die Themen alle Buttons des Editors nur mit erlaubten und erwünschten Stilen belegt und die Option verify_css_classes auf true gesetzt, sollte eigentlich nichts mehr schiefgehen.
Denn in diesem Fall können keine anderen CSS-Klassen als diejenigen, die in der unter content_css eingetragenen Datei zu finden sind, im Editor eingesetzt werden. Elemente mit ungültigen Klassennamen werden einfach entfernt. Durch diese Möglichkeiten ist es leicht, ein konsistentes Konzept für eine CSM-Redaktion aufzusetzen, bei dem nicht vom vorgegebenen Design abgewichen werden kann.
Anwendung
Durch das einfache, im Detail aber sehr feinkörnige Konzept der Konfiguration und Erweiterbarkeit von Tiny-MCE ist ein tiefer Eingriff in den Aufbau der eigenen Seiten auf PHP-Ebene im ersten Schritt nicht notwendig. Da auch die Konfiguration und Initialisierung des Editors nicht im Code liegen muss, sondern extern nachgeladen werden kann, beschränkt sich die Arbeit auf das Generieren der wenigen oben genannten Zeilen zur Einbindung des Scripts und der Konfigurations-Datei. Hier können natürlich in Abhängigkeit vom angemeldeten User oder dem dargestellten Seiten-Inhalte unterschiedliche Konfigurationen zur Verfügung gestellt werden. Ein einfaches PHP-Beispiel verdeutlicht dies:
<?php
$groups = array("Redakteure",
"User", "[keine]");
$userGroup = $groups[rand(0, 2)];
switch ($userGroup) {
case "Redakteure":
$currTheme = "advanced";
$currMode = "textareas";
$currNoEdit = 0;
break;
case "User":
$currTheme = "simple";
$currMode = "textareas";
$currNoEdit = 1;
break;
default:
$currTheme = "simple";
$currMode = "textareas";
$currNoEdit = 1;
break; }
?>
[...]<script language="javascript" type=
"text/javascript" src="/scripts/tiny_mce/tiny_mce.js"></script><script language="javascript" type=
"text/javascript">
tinyMCE.init({
mode: "<?php echo($currMode) ?>",
theme: "<?php echo($currTheme)?>",
readonly: <?php echo($currNoEdit)
?> });</script>Wenn Sie hier die Usergruppe des angemeldeten Users ermittelt haben (hier einmal mit einem zufällig ausgelesenen Array nach jedem Laden der Seite simuliert), werden die passenden Werte gesetzt und weiter unten im Script-Teil eingetragen, mit dem dann der Editor initialisiert wird. So haben Mitglieder der Gruppe Redakteure einen umfangreichen Editier-Modus, normale User sehen nur den Text, ohne etwas ändern zu können. Wer keiner Gruppe zugehörig ist, sieht nur den einfachen Texteingabebereich.
