Tipps & Tricks - TinyMCE - Eigene Toolbar
In diesem Beitrag erfahren Sie, wie Sie für
Textfelder,
die
im Editormodus
den TinyMCE-Editor verwenden, eigene Toolbarkonfigurationen erstellen können. Wechseln Sie in das
Portalverzeichnis internal/cfg/htmleditor/tinymce.
Erstellen Sie eine neue Datei mit der Dateiendung .xml (z.B. customConfig.xml). Öffnen Sie diese Datei in einem
beliebigen Texteditor und fügen Sie folgenden Inhalt ein:
<?xml version="1.0" encoding="UTF-8"?>
<toolbarbutton-panel>
<property>
<title de="Meine Toolbar" en=" My Toolbar "/>
</property>
<toolbarbutton-row>
<toolbarbutton name="help" type="standard"/>
</toolbarbutton-row>
</toolbarbutton-panel>
Wichtig ist, dass das Element <toolbarbutton-row> initial mindestens ein Element, in diesem Beispiel
<toolbarbutton>, beinhaltet. In der Zeile
<title de="Meine Toolbar" en=" My Toolbar "/>
kann der Name der Toolbar-Konfiguration geändert werden. Speichern Sie die Datei.
Wechseln Sie nun in das
Modul Applikationen
und
erstellen Sie eine neue Applikation.
Legen Sie dort ein
Textfeld an.
Im
Eigenschaftendialog des Textfelds wechseln Sie
auf den
Reiter Optionen.
Setzen Sie hier die Einstellung "Editormodus". Klicken Sie dann auf
"Standardkonfiguration laden".
Anschließend können Sie Ihre persönliche Toolbarkonfiguration (Liste "Ausgewählte
Schaltflächen") zusammenstellen. Nachdem Sie die gewünschten Schaltflächen zusammengestellt haben,
schließen Sie den Dialog mit Klick auf OK. Markieren Sie das Textfeld und öffnen Sie den
Details-Dialog mit der Taste F4.
Wechseln Sie auf den
Reiter XML.
Kopieren Sie den gesamten Text innerhalb des Elements <toolbarbutton-panel>.
Fügen Sie ihn im Texteditor an Stelle des bisher bestehenden Elements
<toolbarbutton-row> in die Datei "customConfig.xml" ein.
Für unser Beispiel würde der Inhalt der Datei nun so aussehen:
<?xml version="1.0" encoding="UTF-8"?>
<toolbarbutton-panel>
<property>
<title de="Meine Toolbar" en=" My Toolbar "/>
</property>
<toolbarbutton-row>
<toolbarbutton name="bold" type="standard"/>
<toolbarbutton name="italic" type="standard"/>
<toolbarbutton name="underline" type="standard"/>
</toolbarbutton-row>
</toolbarbutton-panel>
Speichern Sie die Datei und schließen Sie den Editor.
Ab sofort kann diese Konfiguration in jeder beliebigen Applikation des Portals
bei einem Textfeld mit Editormodus ausgewählt werden.