Obwohl wir mit dem Script von oben noch gar nicht viel gemacht haben, so haben wir trotzdem schon das erste Problem. Denn durch Copy und Paste von anderen Inhalten in diese Box werden alle Klassen, Farben, Styles und HTML übernommen und auch in der Datenbank gespeichert.

Wir können das mit unserem chMode-Button mal testen. Klickt auf diesen Button und schreibt mal

<h1>Hallo zusammen</h1>

in das Feld rein und speichert den Text ab. Im Frontend sehen wir nun eine große Überschrift.

Heißt: Obwohl wir NUR bold und italic aktiviert haben, so lässt sich der RTE austricksen. Das müssen wir im nächsten Schritt unterbinden.

Wir wollen in diesem Schritt nur den <p>-Tag erlauben und damit das vorhin geschriebene h1 beim Speichern automatisiert löschen lassen. Doch leider sind solche Berechtigungen nicht mehr in den Eigenschaften des rtehtmlarea-Objektes zu finden. Um nur bestimmte HTML-Tags zu erlauben benötigen wir das Unterobjekt "proc".

In der Dokumentation gibt es eine Eigenschaft im Objekt "proc" namens "allowTags". Der Name klingt vielversprechend, allerdings werden die Tags, die hier angegeben werden, einer Reihe bestehender Tags hinzugefügt. Folgende Tags sind von Grund auf in allowTags (hardcoded) schon aktiviert:

b,i,u,a,img,br,div,center,pre,font,hr,sub,sup,p,strong,em,li,ul,ol,blockquote,strike,span

Ein einfaches "allowTags=p" überschreibt diese Voreinstellung NICHT und da das p-Tag schon vorhanden ist, würde mit diesem Befehl auch nichts passieren. Aber es gibt eine weitere Eigenschaft namens denyTags. Mit dieser Eigenschaft könnt Ihr angeben, welche Tags aus allowTags entfernt werden sollen.

RTE.classes >
RTE.classesAnchor >
RTE.default >

RTE.default {
  showButtons = bold, italic, chMode
  proc {
    denyTags = u,a,img,br,div,center,pre,font,hr,sub,sup,strong,em,li,ul,ol,blockquote,strike,span
  }
}

Super: Jetzt haben wir schon so viel verboten und selbst wenn wir etwas fett machen (<b>-Tag), ist es nach der Speicherung verschwunden. ABER: Unser h1-Tag ist immer noch da! Das ist korrekt, wenn man weiß, was mit dem Inhalt auf dem Weg zur Datenbank passiert. Kurz: Die Transformation css_transform kümmert sich darum, dass Überschriften unberührt in die Datenbanken wandern. Um nun auch dieses h1 zu entfernen, benötigen wir das Objekt entryHTMLparser, das den Inhalt noch mal genauer unter die Lupe nehmen kann.

Im folgenden Script finden wir nun endlich ein Script, dass wirklich NUR bold und italic unterstützt und nichts Anderes AUCH wenn man von Word oder anderen Programmen Code in diesen RTE hineinkopiert:

RTE.classes >
RTE.classesAnchor >
RTE.default >

RTE.default {
  showButtons = bold, italic, chMode
  proc {
    overrideMode = css_transform
    allowedClasses = bodytext
    denyTags = u,a,img,br,div,center,pre,font,hr,sub,sup,strong,em,li,ul,ol,blockquote,strike,span
    entryHTMLparser_db = 1
    entryHTMLparser_db {
      allowTags = p,b,i
    }
  }
}

Erklärung:
Wenn wir, wie in unserem Fall einen HTMLparser verwenden müssen, dann müssen wir diesen zuvor mit entryHTMLparser_db = 1 aktivieren. Dies gilt für die beiden HTMLparser VOR und NACH der Transformation. Für die beiden HTMLparser, die während der Transformation ausgeführt werden (HTMLparser_db, HTMLparser_rte) gilt dies nicht.

Das allowTags von proc kann NICHT mit dem allowTags vom HTMLparser-Objekt verglichen werden! Denn während im proc-Objekt, die angegebenen Tags den bereits vorhandenen allowTags hinzugefügt werden, werden die Tags bei der Eigenschaft allowTags des HTMLparsers komplett überschrieben. Deshalb müssen wir hier das p-Tag für den normalen Text, das b-Tag für fett und das i-Tag für kursiv nochmals angeben.

Ich habe hier noch die Eigenschaft allowedClasses angegeben. Grundsätzlich sind ALLE Classes erlaubt. Wir könnten also auch

<p class="test">Hallo zusammen</p>

in den RTE schreiben und er würde es anstandslos speichern. Um fehlerhafte Usereingaben zu unterbinden, müssen wir mindestens eine Klasse hier angeben. Eine Einstellung wie "allowedClasses >" oder "allowedClasses =" haben keine Auswirkung. Da jeder reinen Textzeile die Klasse bodytext hinzugefügt wird, habe ich mich in unserem Beispiel an bodytext angelehnt. Die Klasse "test" von unserem oberen Beispiel wird also nun komplett mit dem Attribut "class" entfernt.

Nachdem wir nun ein erstes Gefühl für den RTE bekommen haben, werden wir uns nun um das ganze DrumRum des RTE kümmern. Lest Euch die folgenden Links zumindest mal durch, damit Ihr den Problematiken, die noch auf Euch zukommen werden aus dem Weg gehen könnt.