Joomla! Documentation™

TinyMCE ist der Standard-Editor für Front- und Backend-Benutzer. TinyMCE ist ein WYSIWYG (what you see is what you get) Editor, der Benutzern eine gewohnte Word-Oberfläche zur Verfügung stellt, wenn Beiträge oder andere Elemente bearbeitet werden. TinyMCE kann mit drei unterschiedlichen Voreinstellungen der Werkzeugleiste konfiguriert werden. Voreinstellung 0, Voreinstellung 1 und Voreinstellung 2. Die Einstellung erfolgt im Plugin Manager für das " Editor - TinyMCE"-Plugin.

TinyMCE can be configured with 3 different sets of toolbar buttons

• Set 2 is assigned to 'Public'.
• Set 1 is assigned to the 'Manager' and 'Registered'.
• Set 0 is the most extended toolbar and is by default assigned to the 'Administrator', 'Editor' and 'Super Users'.

Toolbars

Voreinstellung 2 Werkzeugleiste

Die Voreinstellung 2 stellt eine Werkzeugleiste mit einer Button-Reihe wie unten angezeigt bereit:

• Die Buttons ändern Text in Fett, Kursiv, Unterstrichen oder Durchgestrichen
• Rückgängig (Cmd+Z) und Wiederholen (Cmd+Y).
• Aufzählungs-Liste, Nummerierte Liste.
• Als Text einfügen. Oft sind in kopierten und eingesetzten Texten aus PDF-Dateien, Word-Dokumenten oder Web-Seiten unnötige und unerwünschte Formatierungs-Informationen enthalten."Als Text einfügen" entfernt alle Formatierungen des Textes. "Als Text einfügen" versucht, einige Formatierungen zu erhalten und unnötige Formatierungen zu entfernen.

Felder, Bild, Weiterlesen einfügen. In einem Popup-Fenster das einzufügende Element auswählen.

Voreinstellung 1 Werkzeugleiste

Die Voreinstellung 1 stellt eine drei-reihige (abhängig vom Bildschirm) Werkzeugleiste wie unten angezeigt bereit:

Sie ist die Standard-Einstellung für die Benutzergruppen Manager und Registriert. Die drei-reihige Werkzeugleiste enthält viele gebräuchliche Bearbeiten-Befehle wie:

Oberste Reihe.

• Buttons von oben links ändern den Text in Fett, Kursiv, Unterstrichen oder Durchgestrichen. Die nächsten Buttons ändern die Textausrichtung in Linksbündig, Zentriert, Rechtsbündig und Blocksatz.
• Format. Auswahl vorgefertigter Formate für Absatz, Preformatted, Überschrift1 und so weiter.
• Aufzählungs-Liste, Nummerierte Liste, Einzug verkleinern (nach links) und Einzug vergrößern (nach rechts).
• Rückgängig (Cmd+Z) und Wiederholen (Cmd+Y).

Zweite Reihe.

• Link einfügen/bearbeiten. Um einen Link einzufügen oder zu bearbeiten, den verlinkten Text markieren und den Button anklicken. Im Popup-Dialog können Details zum Link eingegeben werden.
• Link entfernen. Um den Link zu entfernen, den verlinkten Text markieren und den Button anklicken.
• Textmarke. Eine Textmarke (Anker) ist ein Lesezeichen innerhalb eines Beitrages, das direkt zum Beitragesteil führt. Um eine Textmarke einzufügen, an der gewünschte Beitragsstelle den Button anklicken. Im angezeigten Fenster den Namen der Textmarke eintragen und Ok klicken. Ein kleines Symbol der Textmarke wird an der Stelle der Textmarke angezeigt. Der Name der Textmarke kann durch markieren des Symbols und anklicken des Buttons bearbeitet werden. Um die Textmarke zu löschen, muß sie markiert werden, danach die Entfernen-Taste drücken.
• Quelltext. Ein Popup-Fenster zeigt den HTML-Quelltext, der direkt bearbeitet werden kann.
• Horizontale Linie einfügen.
• Neue Tabelle einfügen, Zeileneigenschaften, Zelleneigenschaften, Neue Zeile davor einfügen, Neue Zeile danach einfügen, Zeile löschen, Neue Spalte davor einfügen, Neue Spalte danach einfügen, Spalte löschen, Zellen aufteilen, Zellen verbinden.
• Tiefgestellt, Hochgestellt, Sonderzeichen.
• Als Text einfügen. Oft sind in kopierten und eingesetzten Texten aus PDF-Dateien, Word-Dokumenten oder Web-Seiten unnötige und unerwünschte Formatierungs-Informationen enthalten."Als Text einfügen" entfernt alle Formatierungen des Textes. "Als Text einfügen" versucht, einige Formatierungen zu erhalten und unnötige Formatierungen zu entfernen.
• Vorschau.
• Modul, Menü, Kontakt, Felder einfügen. In einem Popup-Fenster das einzufügende Element auswählen.

Dritte Reihe.

Beitrag, Bild, Seitenumbruch, Weiterlesen einfügen. In einem Popup-Fenster das einzufügende Element auswählen.

Voreinstellung 0 Werkzeugleiste

---

Die Voreinstellung 0 stellt die Werkzeugleiste mit den umfangreichsten Bearbeitungs-Optionen wie unten angezeigt bereit:

Diese Voreinstellung stellt die gleichen Buttons wie in der Voreinstellungen 1 (Erweitert) Werkzeugleiste oben zur Verfügung. Zusätzlich sind folgende Optionen verfügbar:

Erste Reihe.

• Formate. Bildunterschriften und Seitenumbruch können angewendet werden. Den gewünschten Text markieren und das Format wählen. Damit wird Text durch CSS-Regeln formatiert.
• Schriftart. Die gewünschte Schrift wählen.
• Schriftgröße. Die gewünschte Schriftgröße wählen.
• Suchen und Ersetzen.

Zweite Reihe.

• Textfarbe oder Hintergrundfarbe wählen.
• Zum Vollbild wechseln.
• Neue Tabelle einfügen, Zeileneigenschaften, Zelleneigenschaften, Neue Zeile davor einfügen, Neue Zeile danach einfügen, Zeile löschen, Neue Spalte davor einfügen, Neue Spalte danach einfügen, Spalte löschen, Zellen aufteilen, Zellen verbinden.
• Emoticons einfügen.
• Medien einfügen/bearbeiten. Um Medien (wie Flash) einzufügen, den Cursor an die gewünschte Stelle setzen und den Button anklicken. In einem Popup-Fenster können Typ, Datei oder URL und weitere Informationen zu den Medien eingegeben werden.
• Von links nach rechts und Von rechts nach links. Die Buttons ändern die Techtlaufrichtung, zum Beispiel für Sprachen, die von rechts nach links gelesen werden.
• Ausschneiden, Kopieren, Einfügen, Als Text einfügen. Oft sind in kopierten und eingesetzten Texten aus PDF-Dateien, Word-Dokumenten oder Web-Seiten unnötige und unerwünschte Formatierungs-Informationen enthalten."Als Text einfügen" entfernt alle Formatierungen des Textes. "Als Text einfügen" versucht, einige Formatierungen zu erhalten und unnötige Formatierungen zu entfernen.

Dritte Reihe.

• Unsichtbare Zeichen anzeigen (wie Absatz-Ende).
• Blöcke anzeigen.
• Geschützes Leerzeichen einfügen.
• Zitat.
• Vorlage einfügen.

This is set as an option in Plugins for Editor - TinyMCE.

Editor Buttons

8 buttons are located at the bottom row of the editor toolbar and one below the content, as shown below:

Module: This button opens a modal window that allows you to easily create a link to any module on the current site. The link is created using the module's title as the link text.

To create a link to the desired module:

• Place the cursor at the point in the article where you want the linked module title to be inserted.
• Click on the Module button to open the modal window.
• Click on the title to select the desired module in the modal window. You can use the filters and search to help find the desired module.
• A link with the module's title will be inserted at the current cursor location.
• If needed, you can edit the link text.

Menu: This button opens a modal window that allows you to easily create a link to any menu on the current site. The link is created using the Menu's title as the link text.

To create a link to the desired menu:

• Place the cursor at the point in the article where you want the linked menu title to be inserted.
• Click on the Menu button to open the modal window.
• Click on the title to select the desired menu in the modal window. You can use the filters and search to help find the desired menu.
• A link with the menu's title will be inserted at the current cursor location.
• If needed, you can edit the link text.

Contact: This button opens a modal window that allows you to easily create a link to any contact on the current site. The link is created using the Contacts title as the link text. The modal window is the same as for selecting a contact for a Single Contact Menu Item.

To create a link to the desired contact:

• Place the cursor at the point in the article where you want the linked contact title to be inserted.
• Click on the Contact button to open the modal window.
• Click on the title to select the desired contact in the modal window. You can use the filters and search to help find the desired contact.
• A link with the contacts title will be inserted at the current cursor location.
• If needed, you can edit the link text.

Fields: This button opens a modal window that allows you to easily create a link to any field on the current site. The link is created using the fields title as the link text. Note: The button is shown if at least one field is created.

To create a link to the desired field:

• Place the cursor at the point in the article where you want the linked field title to be inserted.
• Click on the Field button to open the modal window.
• Click on the title to select the desired field in the modal window. You can use the filters and search to help find the desired field.
• A link with the fields title will be inserted at the current cursor location.
• If needed, you can edit the link text.

Article: This button opens a modal window that allows you to easily create a link to any article on the current site. The link is created using the article's title as the link text. The modal window is the same as for selecting an article for a Single Article Menu Item.

To create a link to the desired article:

• Place the cursor at the point in the article where you want the linked article title to be inserted.
• Click on the Article button to open the modal window.
• Click on the title to select the desired article in the modal window. You can use the filters and search to help find the desired article.
• A link with the article's title will be inserted at the current cursor location.
• If needed, you can edit the link text.

Image. This button provides an easy way to insert an image into an Article. Images may be inserted from the 'images' folder and may also be uploaded. When you click the Image button, a window pops up, as shown below:

• Folder. The current directory on the host server. This is the 'images' directory under your Joomla! home directory. Use the drop-down list box to select a subdirectory.
• Up. Navigate to the parent directory. Note that the top directory for this function is 'images'. You can not navigate to a higher directory.
• Insert. Insert the selected image. The insert point will be the current cursor position. You will see the image display inside the edit window.
• Cancel. Cancel the operation and close the popup window. You can cancel also in clicking the X at right top corner.
• Thumbnail Browse Area. Click on an image thumbnail to select the image. Click on a folder icon to navigate to that subdirectory.
• Image URL. Click on one of the image thumbnails and the URL for the image will be entered for you.
• Image Description. Enter a description for the image.
• Caption. If entered, this will displayed as a caption below the image.
• Image Float. This will apply the classes 'pull-left', 'pull-center' or 'pull-right' to the '<figure>' or '<img>' element.
• Image Title. Enter a Title for this image. This displays when a User hovers the mouse on the image.
• Caption Class. This will apply the entered class to the '<figcaption>' element. For example: 'text-left', 'text-center'.
• Upload file. Click this button to browse to an image file to upload from your local computer. A file dialog will open allowing you to select a file.
• Start Upload. Once you have selected a file, press this button to upload the file to your Joomla! 'images' folder. The thumbnail for the new image will now show in the thumbnail area.

Pagebreak. This button allows you to insert a pagebreak inside an Article. A pagebreak allows for page navigation when the article is displayed on a layout. This is useful for long articles. When this button is pressed, a popup window is displayed as shown below:

• Page Title. Enter the title to display for the new page (for example, 'Page 2').
• Table of Contents Alias. Optional field to display in the table of contents for this page. In a multi-page article, Joomla! displays a 'table of contents' for the page that allows the user to select any page. If this field is blank, the Page Title will be used. If you want a different title in the table of contents, enter it here.
• Insert Page Break. Click this button to insert the pagebreak with the entered fields. The Pagebreak will display as a gray dashed line across the Article. Note that a pagebreak cannot be edited. If you need to change a field in the pagebreak, click on the Article just past the pagebreak, press Backspace until the pagebreak is deleted, then insert a new pagebreak with the desired information.

• Read More. This button inserts a 'Read more...' break in the Article. This shows as a red dotted line across the Article. If an Article has a 'Read more...' break, only the text before the break, called the Intro Text, will initially display, along with a 'Read more...' link.
  If the User clicks this link, either the entire Article or just the part after the 'Read more...' link is displayed. This depends on the setting of the 'Intro Text' parameters for the Article and in the Global Configuration. The 'Read more...' break allows you to save space on pages by just showing the Intro Text.
  Note: The 'Read more...' break only shows in the Frontend, and Category Blog layouts. If you want to insert breaks for an Article shown in an Article Layout, use the Page Break button.

• Toggle editor. If you are using the TinyMCE editor, a Toggle editor button will show just below the edit window. This button allows you to toggle between the TinyMCE editor and No Editor.

Barrierefreiheit

TinyMCE ist mit Screenreadern wie JAWS und NVDA kompatibel. Man kann ihn auch ohne Maus benutzen. Um die Werkzeugleiste des Editors zu benutzen, folgende Tastenkürzel benützen:

• [ALT + F9] Bewegt den Fokus und springt in die Menüleiste
• [ALT + F10] Bewegt den Fokus und springt in die Werkzeugleiste
• [ALT + F11] Bewegt den Fokus und springt in den Element-Pfad
• Schließt Menu/Untermenü/Dialog (kehrt in den Editor-Bereich zurück)
• Navigation links/rechts durch Menü- und Werkzeugleiste

Für weitere Informationen siehe: TinyMCE - Accessibility