Editoren: Einführung

TinyMCE

TinyMCE ist der Standardeditor für Frontend- und Backend-Benutzer. Der Editor bietet Benutzern eine vertraute Textverarbeitungsoberfläche zur Bearbeitung von Inhalten.

TinyMCE kann mit 3 verschiedenen Sätzen von Symbolleisten-Schaltflächen konfiguriert werden. Dies wird im Plugin Editor – TinyMCE eingestellt.

Symbolleisten

Einfache Voreinstellung

Der Symbolleisten-Satz 2 stellt eine Zeile mit Schaltflächen bereit, wie unten gezeigt. Dieser Satz ist standardmäßig der Benutzergruppe Öffentlich zugewiesen.

• Mit den Schaltflächen kann Text fett, unterstrichen oder durchgestrichen formatiert werden.
• Rückgängig und Wiederholen.
• Unsortierte Liste, Sortierte Liste.
• Als Text einfügen: Beim Kopieren und Einfügen von Text aus anderen Quellen, wie PDF-Dateien, Textdokumenten oder Webseiten, enthält der ausgewählte Text häufig Formatierungsinformationen, die nicht benötigt oder gewünscht werden. Mit der Funktion „Als Text einfügen“ werden alle Formatierungen aus dem Text entfernt.

Mittlere Voreinstellung

Der Symbolleisten-Satz 1 stellt zwei Zeilen mit Schaltflächen bereit, wie unten gezeigt. Dieser Satz ist standardmäßig den Benutzergruppen Manager und Registriert zugewiesen.

Diese Option bietet alle Schaltflächen, die bereits in der Symbolleiste zu Satz 2 oben beschrieben wurden. Zusätzlich stehen die folgenden Optionen zur Verfügung.

Mittel: Obere Zeile

• CMS-Inhalt: Die Dropdown-Liste ermöglicht den Zugriff auf Links zu einem Beitrag, Kontakt, Feld, Medium, Menü oder Modul.

Beitrag: Das Beispiel zeigt, wie einfach ein Link zu einem beliebigen Beitrag auf der aktuellen Website erstellt werden kann.

So wird ein Link zum gewünschten Beitrag erstellt:

• Den Cursor an die Stelle im Beitrag setzen, an der der Titel des verlinkten Beitrags eingefügt werden soll.
• Auf die Schaltfläche Beitrag klicken, um das Fenster zu öffnen.
• Im Fenster auf den Titel klicken, um den gewünschten Beitrag auszuwählen. Die Suche und die Filter können dabei helfen, den gewünschten Beitrag zu finden.
• Ein Link mit dem Titel des Beitrags wird an der aktuellen Cursorposition eingefügt.
• Falls erforderlich, kann der Linktext bearbeitet werden.

Auf die gleiche Weise können auch andere Einträge wie Medien, Module und so weiter verlinkt werden.

Seitenumbruch: Mit dieser Schaltfläche kann ein Seitenumbruch innerhalb eines Beitrags eingefügt werden. Ein Seitenumbruch ermöglicht die Seitennavigation, wenn der Beitrag in einem Layout angezeigt wird. Dies ist bei langen Beiträgen nützlich. Wird diese Schaltfläche gedrückt, wird ein Fenster wie unten gezeigt angezeigt:

• Seitentitel. Titel eingeben, der für die neue Seite angezeigt werden soll (zum Beispiel 'Seite 2').
• Inhaltsverzeichnis. Optionales Feld, das im Inhaltsverzeichnis für diese Seite angezeigt wird. Bei einem mehrseitigen Beitrag zeigt Joomla ein 'Inhaltsverzeichnis' für die Seite an, mit dem der Benutzer jede Seite auswählen kann. Ist dieses Feld leer, wird der Seitentitel verwendet. Soll im Inhaltsverzeichnis ein anderer Titel erscheinen, hier eingeben.
• Seitenumbruch einfügen. Diese Schaltfläche anklicken, um den Seitenumbruch mit den eingegebenen Feldern einzufügen. Der Seitenumbruch wird als graue gestrichelte Linie quer über den Beitrag angezeigt. Zu beachten ist, dass ein Seitenumbruch nicht bearbeitet werden kann. Soll ein Feld im Seitenumbruch geändert werden, im Beitrag direkt hinter den Seitenumbruch klicken, mit der Rücktaste den Seitenumbruch löschen und anschließend einen neuen Seitenumbruch mit den gewünschten Angaben einfügen.
• Die Konfiguration wird im Plugin Content – Seitenumbruch festgelegt.

Weiterlesen: Diese Schaltfläche fügt einen Weiterlesen-Umbruch in den Beitrag ein. Dieser wird als rote gepunktete Linie quer über den Beitrag angezeigt.

• Hat ein Beitrag einen Weiterlesen-Umbruch, wird zunächst nur der Text vor dem Umbruch angezeigt, genannt Einleitungstext, zusammen mit einem Weiterlesen-Link. Klickt der Benutzer auf diesen Link, wird entweder der gesamte Beitrag oder nur der Teil nach dem Weiterlesen-Link angezeigt. Dies hängt von der Einstellung der Einleitungstext-Parameter des Beitrags ab.
• Der Weiterlesen-Umbruch ermöglicht es, Platz auf Seiten zu sparen, indem nur der Einleitungstext angezeigt wird.
• Sollen Umbrüche für einen Beitrag eingefügt werden, der in einem Beitragslayout angezeigt wird, die Schaltfläche Seitenumbruch verwenden.

Die Schaltflächen in der Dropdown-Liste CMS-Inhalt können in Plugins – editors-xtd deaktiviert werden.

• Die Schaltflächen oben links ermöglichen es, Text kursiv zu formatieren. Daneben befinden sich Schaltflächen für linksbündig, rechtsbündig, zentriert und Blocksatz ausrichten.
• Formate: Vordefinierte Formate für Überschriften, Inline, Blöcke und so weiter auswählen.
• Einzug verringern (nach links verschieben) und Einzug vergrößern (nach rechts einrücken).
• 3 Punkte: Zweite Symbolleistenzeile anzeigen.

Mittel: Zweite Zeile

• Link einfügen/bearbeiten: Um einen Link einzufügen oder zu bearbeiten, den verlinkten Text markieren und diese Schaltfläche drücken. Ein Popup-Dialog wird angezeigt, in dem Details zum Link eingegeben werden können.
• Link entfernen: Um einen Link zu entfernen, den verlinkten Text markieren und diese Schaltfläche drücken.
• Anker: Ein Anker ist ein Lesezeichen innerhalb eines Beitrags, mit dem direkt zu dieser Stelle im Beitrag verlinkt werden kann.
• Quellcode: Ein Popup wird angezeigt, das den HTML-Quellcode zeigt und das Bearbeiten des HTML-Quellcodes ermöglicht.
• Horizontale Linie einfügen: Um eine horizontale Linie einzufügen, den Cursor an die gewünschte Stelle im Beitrag bewegen und diese Schaltfläche anklicken.
• Tabelle: Neue Tabelle einfügen, Tabellenzeileneigenschaften, Tabellenzelleneigenschaften, Zeile davor einfügen, Zeile danach einfügen, Zeile löschen, Spalte davor einfügen, Spalte danach einfügen, Spalte löschen, Zusammengeführte Tabellenzellen teilen, Tabellenzellen zusammenführen.
• Tiefgestellt, Hochgestellt, Sonderzeichen.
• Textvorschau im Popup.

Erweiterte Voreinstellung

Der Symbolleisten-Satz 0 bietet die umfangreichsten Bearbeitungsmöglichkeiten, wie unten dargestellt. Dieser Satz ist standardmäßig den Benutzergruppen Administrator, Redakteur und Super Benutzer zugewiesen.

Diese Option bietet alle Schaltflächen, die bereits bei der Symbolleiste Set 1 oben beschrieben wurden. Zusätzlich stehen folgende Optionen zur Verfügung.

Erweitert: Obere Zeile

• Blöcke: Absatz, Überschriften, Vorformatiert.
• Schriftarten: Gewünschte Schriftart auswählen.
• Schriftgröße: Gewünschte Schriftgröße auswählen.
• Suchen und Ersetzen.
• Bild einfügen/bearbeiten: Um ein Bild einzufügen, den Cursor an die gewünschte Stelle setzen und diese Schaltfläche drücken. Ein Popup-Dialog wird angezeigt, in dem Quelle, Breite oder Höhe und weitere Informationen zum Bild eingegeben werden können.

Erweitert: Zweite Zeile

• Textfarbe oder Hintergrundfarbe auswählen.
• Vollbild.
• Emoticons.
• Medien einfügen: Um Medien einzufügen, den Cursor an die gewünschte Stelle setzen und diese Schaltfläche drücken. Ein Popup-Dialog wird angezeigt, in dem Typ, Datei oder URL und weitere Informationen zu den Medien eingegeben werden können.
• Richtung von links nach rechts oder Richtung von rechts nach links: Mit diesen Schaltflächen kann die Textrichtung eingegeben oder geändert werden, zum Beispiel für Sprachen, die von rechts nach links gelesen werden.
• Ausschneiden, Kopieren, Einfügen.
• Unsichtbare Zeichen anzeigen (wie Absatzenden).
• Blöcke anzeigen.
• Geschütztes Leerzeichen.
• Blockzitat.
• Template einfügen.

Erweitert: Dritte Zeile

• Beitragstext drucken.
• Codebeispiel einfügen/bearbeiten.
• Datum/Uhrzeit einfügen.
• Formatierung entfernen.

Barrierefreiheit

TinyMCE ist mit Bildschirmlesegeräten wie JAWS und NVDA kompatibel. Es kann auch ohne Verwendung der Maus effektiv genutzt werden.

Tastenkombinationen

Weitere Informationen finden sich hier:

• TinyMCE - Barrierefreiheit
• Eine Liste der verfügbaren Tastenkombinationen (PC, Mac) innerhalb des Editorbereichs.

CodeMirror

Der 'Editor - CodeMirror' wurde entwickelt, um die Eingabe von HTML-Code in einem Beitrag oder einer Beschreibung zu erleichtern. CodeMirror unterstützt Syntaxhervorhebung und automatische Vervollständigung, wie im folgenden Screenshot gezeigt.

• Unterhalb des Bearbeitungsfensters angezeigte Schaltflächen ermöglichen den Zugriff auf Verknüpfungen zu beliebigen Einträgen der Seite.
• CodeMirror bietet einige der gleichen Vorteile wie die Verwendung von 'Editor – None', erleichtert jedoch die Arbeit mit rohem HTML-Code.
• Die Konfiguration erfolgt im Plugin Editor - CodeMirror.

Keine

Falls für einen Benutzer 'Editor – None' ausgewählt wurde, wird ein einfacher Texteditor angezeigt. Dies ermöglicht die Eingabe von rohem, unformatiertem HTML. Mit der Schaltfläche 'Vorschau' in der Werkzeugleiste kann angezeigt werden, wie das HTML dargestellt wird.

Zu beachten ist, dass die Option 'None' nützlich sein kann, wenn 'Boilerplate' oder benutzerdefiniertes HTML eingegeben wird, zum Beispiel um einen PayPal-Link zu erstellen. TinyMCE formatiert HTML beim Speichern einer Datei automatisch um und entfernt teilweise HTML. Dies kann dazu führen, dass komplexes HTML nicht mehr korrekt funktioniert.

Falls dies passiert, kann der Editor vorübergehend auf 'None' umgestellt werden, um den gewünschten Inhalt zu erstellen. Zu beachten ist, dass bei künftiger Bearbeitung dieses Inhalts darauf geachtet werden sollte, den Editor weiterhin auf 'None' zu stellen. Andernfalls kann beim Öffnen und Speichern des Inhalts mit TinyMCE das benutzerdefinierte HTML verloren gehen.

Das Plugin 'Editor – None' hat keine Konfiguration.

Quelle: Joomla-Hilfe im Benutzerhandbuch, veröffentlicht unter der Joomla! Electronic Documentation License (JEDL).