Will man ein webbasiertes „What-you-see-is-what-you-get“-Content-Management-System entwickeln, dann gibt es verschiedene Optionen, die man ausprobieren kann.
Die meisten webbasierten Content-Management-Systeme bauen auf standardmäßigen HTML-Formularen auf, um eine Datenbank mit den von den Benutzern eingegebenen Inhalten zu füttern. Dieses Tutorial beschäftigt sich mit verschiedenen Möglichkeiten, Textbereichselemente in Web-Formularen mit Rich-Text-Editoren zu ersetzen, die zwar den gleichen Zweck erfüllen, es den Benutzern aber ermöglichen, Inhalte im WYSIWYG-Format zu bearbeiten.
Die Microsoft-Methode
Microsoft kündigte sein DHTML Editing Component, das mit dem Internet Explorer 5 ausgeliefert wurde, bereits im Jahr 1999 an. Als Active X-Steuerelement beschränkte sich sein Einsatz auf die Windows-Versionen des Browsers, erlaubte allerdings Web-Entwicklern, mit nur wenigen Zeilen Code eine Rich-Text-Editing-Funktion in HTML-Formulare zu integrieren. Seit jener Zeit ist diese Komponente an Dutzende von kostenlosen und kommerziellen DHTML-Skripte angepasst worden, die eigens für das Management von Web-Inhalten geschrieben wurden. Die Erstellung eines solchen Skripts beginnt mit dem zum Aufruf der Komponente erforderlichen OBJECT-Tag, anschließend wird eine Reihe von Javascript-Befehlen benötigt, um weitere Funktionen hinzuzufügen. Da die DHTML-Editing-Komponente über keinerlei Symbolleisten- oder Benutzeroberflächenelemente verfügt, ist es erforderlich, dass alle Aufbereitungsarbeiten wie zum Beispiel Änderungen der Schriftart, -größe oder -farbe programmatisch durchgeführt werden.
Listing A
Dieser Code ist das Mindeste, was für die Erstellung einer Instanz des DHTML-Objekts erforderlich ist, die das hier gezeigte Ergebnis produziert. Anschließend wird die Methode ExecCommand() zum Auslösen von Ereignissen innerhalb des Editor-Objekts verwendet. Der folgende Code beispielsweise formatiert den markierten Text im Editor fett, wenn das verknüpfte „B“ angeklickt wird.
Listing B
Mit dem hier aufgeführten Code kann ein einfacher DHTML-Editor für simple Textformatierungen erstellt werden.
Listing C
Die hier verwendeten Variablen speichern die von dem Active X-Steuerelement erwarteten Konstanten. Eine komplette Liste dieser Werte befindet sich in der Datei dhtmled.js, die in Microsofts DHTML-Beispielanwendung (editcntrl.exe) enthalten ist. Diese Datei kann mit der nachstehenden Syntax in die Seite eingebunden werden:
Listing D
Indem man die in dieser Datei enthaltenen Befehle mit einer Mischung aus Javascript und Schaltflächensymbolen kombiniert, kann man eine Symbolleiste mit allen erforderlichen Funktionen eines benutzerspezifischen WYSIWYG-Editors erstellen. Das Einzige, was fehlt, ist der Code, um den Inhalt des Editors einem Formularfeld zuzuordnen, das als Teil eines HTML-Formulars übermittelt werden kann. Das kann über ein ausgeblendetes Feld im Formular erfolgen, dem der HTML-Inhalt beim Abschicken des Formulars dynamisch zugeordnet wird. Zugriff auf den Inhalt des DHTML-Steuerelements erfolgt über dessen Eigenschaft DOM.body.innerHTML, wie es in Listing E gezeigt wird.
Listing E
Offensichtlich ist die DHTML-Komponente eine sehr schnelle und einfache Methode zur Integration der WYSIWYG-Funktionalität in ein IE-basiertes Content-Management-System. Möchte oder muss man allerdings den Mozilla-Browser unterstützen, so muss man sich nach einer anderen Lösung umsehen.
Erstmals liegen Preise für Verbraucher vor. Sie zahlen weniger als Geschäftskunden. Dafür beschränkt Microsoft den…
Die Entwickler arbeiten noch an weiteren „Verfeinerungen“. Windows Insider erhalten nun wohl eine erste Vorschau…
Laut Bitkom-Umfrage werden in jedem dritten Unternehmen in Deutschland private KI-Zugänge genutzt. Tendenz steigend.
2023 erlitten neun von zehn Unternehmen in der DACH-Region Umsatzverluste und Kurseinbrüche in Folge von…
Der Report „Pacific Rim“ von Sophos beschreibt Katz-und-Maus-Spiel aus Angriffs- und Verteidigungsoperationen mit staatlich unterstützten…
NVIDIA DGX SuperPOD soll voraussichtlich Mitte 2025 in Betrieb genommen und für Forschungsberechnungen genutzt werden.