TinyMCE-Editor: Unterschied zwischen den Versionen

Aktuelle Version vom 20. August 2014, 15:05 Uhr

Der TinyMCE-Editor ist ein Text-Editor-Plugin. Es kann von der Moodle-Administration auf der Seite Einstellungen > Website-Administration > Plugins > Texteditoren > Übersicht aktiviert, deaktiviert oder als Standard-Editor gesetzt werden kann.

Nutzer/innen können in ihrem Profil den TinyMCE als bevorzugten Editor wählen (anstelle des Standard-Editors Atto): Einstellungen > Mein Profil > Profil bearbeiten.

Liste der Symbole

Für diejenigen, die nicht mit den Symbolen eines Textverarbeitungsprogramms vertraut sind, werden die einzelnen Symbole im folgenden nach Gruppen sortiert beschrieben.

Hinweis: Administrator/innen können die Symbolleiste anpassen - es kann also sein, dass die Symbolleiste in Ihrer Moodle-Installation ein bisschen anders aussieht.

Zeile 1

1 - Symbolleisten ein-/ausblenden
2 - Absatzformatierung
3 - Fett
4 - Kursiv
5 - Unsortierte Liste einfügen
6 - Geordnete Liste einfügen
7 - Link einfügen/bearbeiten
8 - Link entfernen
9 - Autoverlinkung verhindern
10 - Bild einfügen/bearbeiten
11 - Emoticon einfügen
12 - Medien einfügen
13 - Eingebettete Dateien verwalten

Zeile 2

1 - Rückgängig
2 - Wiederholen
3 - Unterstrichen
4 - Durchgestrichen
5 - Tiefgestellt
6 - Hochgestellt
7 - Linksbündig
8 - Zentriert
9 - Rechtsbündig
10 - Ausrücken
11 - Einrücken
12 - Textfarbe
13 - Hintergrundfarbe
14 - Schrift von links nach rechts
15 - Schrift von rechts nach links

Zeile 3

1 - Schriftart
2 - Schriftgröße
3 - HTML-Code bearbeiten
4 - Suchen
5 - Suchen/Ersetzen
6 - Geschütztes Leerzeichen einfügen
7 - Sonderzeichen einfügen
8 - Tabelle erstellen/bearbeiten
9 - Quellcode bereinigenAls unformatierten Text einfügen
10 - Formatierungen entfernen
11 - Als unformatierten Text einfügen
12 - Als formatierten Text einfügen
13 - Vollbildschirm

Spezialeffekte

Farben

Es gibt vier verschieden Möglichkeiten für die Auswahl einer Schrift- oder Hintergrundfarbe:

eine 5x8 Schnellauswahlpalette und über einen Link Weitere Farben die Möglichkeit, eine Farbe über
Farbwahl
Palette oder
Benannte Farben

auszuwählen.

5x8 Schnellauswahlpalette
Regenbogen-Farbwahl
Palette mit 18x12 Farben
Benannte Farben - Eingabe der Farbcodierung

Tabelle einfügen

Tabellen werden mittel Tabellen-Symbol (8, 3.Zeile) eingefügt.

Tabellenränder sind wichtig für die Lesbarkeit einer Tabelle. Sollten sie nicht richtig angezeigt werden, fügen Sie die Ränder manuell ein:

Markieren Sie alle Zellen der Tabelle.
Klicken Sie die rechte Maustaste und wählen Sie im Kontextmenü den Punkt Eigenschaften der Tabelle aus.
Klicken Sie auf den Reiter Erweitert.
Wählen Sie einen Rahmen (z.B. alle 4 Seiten (Box)), ein Gitter (z.B. zwischen allen Zellen), eine Rahmenfarbe (z.B. schwarz).
Klicken Sie auf den Button Aktualisieren.

Systemweite Einstellungen

Als Administrator/in können Sie verschiedene Einstellungen für den TinyMCE Editor vornehmen.

Grundeinstellungen

Auf der Seite Einstellungen > Website-Administration > Plugins > Texteditoren > Texteditor TinyMCE > Grundeinstellungen gibt es folgende Konfigurationsmöglichkeiten:

Plugins

Standardmäßig gibt es in der Symbolleiste des Text-Editors Buttons für

Hilfe per CTRL+Rechtsklick
Formel einfügen
Eingebettete Dateien verwalten - bietet Zugriff auf das Repository Eingebettete Dateien
Emoticon einfügen
Bild einfügen
Medien einfügen
Autoverlinkung verhindern
Toolbar umschalten
Rechtschreibung prüfen
Umbruch

Sie können diese Buttons verbergen, indem Sie in der Tabelle in der entsprechenden Zeile auf den Link Deinstallieren klicken.

Einstellungen

Symbolleiste des Editors: In diesem Eingabebereich können Sie eintragen, welche Buttons in der Symbolleiste des TinyMCE-Editors zur Verfügung gestellt werden. Jede Zeile entspricht einer Buttonreihe. Eine Zeile enthält eine kommagetrennte Liste der einzelnen Buttons in der Reihe.
Verfügbare Zeichensätze: In diesem Eingabebereich tragen Sie ein, welche Zeichensätze der TinyMCE-Editor bereitstellt.
Erweiterte Einstellungen: Hier können Sie weitere Einstellungen für den TinyMCE-Editor vornehmen. Die Einstellungen müssen im JSON-Format eingegeben werden:

{"option1" : "value1", "option2" : "value2"}

Alle hier gesetzten Optionen überschreiben die Standard- und Plugineinstellungen.

Detaillierte Informationen mit Beispielen zu den erweiterten Einstellungen finden Sie in MDL-37186 und auf der Website von TinyMCE.

Formel einfügen

Auf der Seite Einstellungen > Website-Administration > Plugins > Texteditoren > Texteditor TinyMCE > Formel einfügen können Sie festlegen, ob der TeX-Filter im Kontext des TinyMCE-Editors verwendet werden soll. Wenn Sie diese Checkbox markieren und der TeX-Filter aktiviert ist, dann wird in der Symbolleiste des TinyMCE-Editors der DragMath-Button zum Einfügen einer Formel angezeigt.

Emoticon einfügen

Auf der Seite Einstellungen > Website-Administration > Plugins > Texteditoren > Texteditor TinyMCE > Emoticon einfügen können Sie festlegen, ob das Emoticon-Symbol in der Symbolleiste des TinyMCE-Editors verfügbar ist. Markieren Sie dazu die Checkbox Emoticon-Filter notwendig und aktivieren Sie den Emoticon-Filter im Kontext des TinyMCE-Editors.

Systemweite HTML-Einstellungen

Administrator/innen können die Emoticons bearbeiten, die in den Texteditoren verwendet werden. Klicken Sie dazu im Block Einstellungen > Website-Administration > Darstellung > HTML-Einstellungen.

Rechtschreibung prüfen

Auf der Seite Einstellungen > Website-Administration > Plugins > Texteditoren > Texteditor TinyMCE > Rechtschreibprüfung können Sie die Rechtschreibprüfung konfigurieren:

Rechtschreibprüfung: Standardmäßig verwendet der TinyMCE-Editor von Moodle Google Spell als Rechtschreibprüfung.
Liste zur Rechtschreibkontrolle: Hier tragen Sie ein, für welche Sprachen die Rechtschreibprüfung durchgeführt werden soll.

Geschwindigkeit von TinyMCE in Firefox und Chrome

Einige Nutzer/innen beklagen sich, dass der TinyMCE-Editor sehr langsam ist (siehe https://moodle.org/mod/forum/discuss.php?d=232089 und https://moodle.org/mod/forum/discuss.php?d=223125).

Um die Geschwindigkeit zu erhöhen, können Sie alle Plugins des TinyMCE-Editors deaktivieren. Dann stehen einige Funktionen (z.B. Emoticons) nicht zur Verfügung, aber der Editor arbeitet deutlich schneller.

Siehe auch

Video zum Text-Editor in Moodle (englisch)
Text-Editor FAQ

@@ Zeile 1: / Zeile 1: @@
 {{Text editieren}}
-Der Text-Editor (manchmal auch HTML- oder TinyMCE-Editor genannt) stellt einige Symbole zur Verfügung, die beim Erstellen von formatierten Texten nützlich sind. Die meisten Symbole sollten aus bekannten Textverarbeitungsprogrammen, wie z.B. Word bekannt sein.
+Der [[TinyMCE-Editor]] ist ein Text-Editor-Plugin. Es kann von der Moodle-Administration auf der Seite ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Plugins > Texteditoren > Übersicht'' aktiviert, deaktiviert oder als Standard-Editor gesetzt werden kann.
-[[Image:HTMLEditortoolbar.jpg]]
+Nutzer/innen können in ihrem Profil den TinyMCE als bevorzugten Editor wählen (anstelle des Standard-Editors  [[Text-Editor|Atto]]): ''[[Einstellungen-Block|Einstellungen]] > Mein Profil > Profil bearbeiten''.
 ==Liste der Symbole==
@@ Zeile 12: / Zeile 11: @@
 Zeile 1
-*[[Image:HTML_editor_group_font_style.png]] - Schriftart, Schriftgröße, Überschrift
-*[[Image:HTML_editor_group_undo_redo.png]] - Rückgängig / Wiederholen (Schritt vor Schritt zurück)
+[[Image:tinymcerow1.png]]
-*[[Image:HTML_editor_group_find_replace.png]] - Suchen und Ersetzen
-*[[Image:HTML_editor_group_fullscreen_1.png]] Vollbildschirm
+*1 - Symbolleisten ein-/ausblenden
+*2 - Absatzformatierung
+*3 - Fett
+*4 - Kursiv
+*5 - Unsortierte Liste einfügen
+*6 - Geordnete Liste einfügen
+*7 - Link einfügen/bearbeiten
+*8 - Link entfernen
+*9 - Autoverlinkung verhindern
+*10 - Bild einfügen/bearbeiten
+*11 - Emoticon einfügen
+*12 - Medien einfügen
+*13 - Eingebettete Dateien verwalten
 Zeile 2
-*[[Image:HTML editor group text effects.png]] - Texthervorhebungen (fett, kursiv, unterstrichen, hochgestellt, tiefgestellt)
-*[[Image:HTML editor group line format.png]] - Textsatz (linksbündig, zentriert, rechtsbündig)
+[[Image:tinymcerow2.png]]
-*[[Image:HTML_editor_group_formatting.png]] - Formattierungen
-*[[Image:HTML_editor_group_color.png]] - Farben
+*1 - Rückgängig
-*[[Image:HTML_editor_group_paragraph.png]] - rechts- und linksbündige Absätze
+*2 - Wiederholen
+*3 - Unterstrichen
+*4 - Durchgestrichen
+*5 - Tiefgestellt
+*6 - Hochgestellt
+*7 - Linksbündig
+*8 - Zentriert
+*9 - Rechtsbündig
+*10 - Ausrücken
+*11 - Einrücken
+*12 - Textfarbe
+*13 - Hintergrundfarbe
+*14 - Schrift von links nach rechts
+*15 - Schrift von rechts nach links
 Zeile 3
-*[[Image:HTML_editor_group_lists.png]] - Aufzählungen und Einrückungen
-*[[Image:HTML_editor_group_link.png]] - Verlinkungen
+[[Image:tinymcerow3.png]]
-*[[Image:HTML_editor_group_insert.png]] - Einfügen (Bilder, Multimedia, Formeln, geschütztes Leerzeichen, Sonderzeichen, Tabellen)
-*[[Image:HTML_editor_group_HTML_spell.png]] - HTML-Quellcode und Rechtschreibprüfung
+*1 - Schriftart
+*2 - Schriftgröße
+*3 - HTML-Code bearbeiten
+*4 - Suchen
+*5 - Suchen/Ersetzen
+*6 - Geschütztes Leerzeichen einfügen
+*7 - Sonderzeichen einfügen
+*8 - Tabelle erstellen/bearbeiten
+*9 - Quellcode bereinigenAls unformatierten Text einfügen
+*10 - Formatierungen entfernen
+*11 - Als unformatierten Text einfügen
+*12 - Als formatierten Text einfügen
+*13 - Vollbildschirm
 ==Spezialeffekte==
@@ Zeile 40: / Zeile 76: @@
 <gallery>
-Image:HTML_editor_color_selector_basic_1.png|5x8 Schnellauswahlpalette
+Image:color1.png|5x8 Schnellauswahlpalette
-Image:HTML_editor_color_selector_more_picker_1.png|Regenbogen-''Farbwahl''
+Image:color2.png|Regenbogen-''Farbwahl''
-Image:HTML_editor_color_selector_more_pallet_1.png|''Palette'' mit 18x12 Farben
+Image:color3.png|''Palette'' mit 18x12 Farben
-Image:HTML_editor_color_selector_more_named_1.png|''Benannte Farben'' - Eingabe der Farbcodierung
+Image:color4.png|''Benannte Farben'' - Eingabe der Farbcodierung
 </gallery>
-===Einfügen===
+===Tabelle einfügen===
-[[Image:HTML_editor_group_insert_MU_1.png]]
+Tabellen werden mittel Tabellen-Symbol (8, 3.Zeile) eingefügt.
-* 1 - Bilddatei einfügen - mit Hilfe des [[Datei-Browser]]s
+Tabellenränder sind wichtig für die Lesbarkeit einer Tabelle. Sollten sie nicht richtig angezeigt werden, fügen Sie die Ränder manuell ein:
-* 2 - Emoticon einfügen
+#Markieren Sie alle Zellen der Tabelle.
-* 3 - Multimedia einfügen - mit Hilfe des [[Datei-Browser]]s
+#Klicken Sie die rechte Maustaste und wählen Sie im Kontextmenü den Punkt ''Eigenschaften der Tabelle'' aus.
-* 4 - Formel - mit Hilfe des JavaScript-Editors
+#Klicken Sie auf den Reiter ''Erweitert''.
-* 5 - geschütztes Leerzeichen einfügen
+#Wählen Sie einen ''Rahmen'' (z.B. ''alle 4 Seiten (Box)''), ein ''Gitter'' (z.B. ''zwischen allen Zellen''), eine ''Rahmenfarbe'' (z.B. schwarz).
-* 6 - Sonderzeichen einfügen
+#Klicken Sie auf den Button ''Aktualisieren''.
-* 7 - Tabelle einfügen
+==Systemweite Einstellungen==
+Als Administrator/in können Sie verschiedene Einstellungen für den TinyMCE Editor vornehmen.
-====Datei-Browser ====
+===Grundeinstellungen===
-[[Image:Datei-Browser.jpg]]
+Auf der Seite ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Plugins > Texteditoren > Texteditor TinyMCE > Grundeinstellungen'' gibt es folgende Konfigurationsmöglichkeiten:
-====Formel-Editor====
+====Plugins====
-[[Image:Formeleditor.jpg]]
+Standardmäßig gibt es in der Symbolleiste des Text-Editors Buttons für
+*''Hilfe per CTRL+Rechtsklick
+*''Formel einfügen''
+*''Eingebettete Dateien verwalten'' - bietet Zugriff auf das Repository [[Eingebettete Dateien]]
+*''Emoticon einfügen''
+*''Bild einfügen''
+*''Medien einfügen''
+*''Autoverlinkung verhindern''
+*''Toolbar umschalten''
+*''Rechtschreibung prüfen''
+*''Umbruch''
-====Sonderzeichen====
+Sie können diese Buttons verbergen, indem Sie in der Tabelle in der entsprechenden Zeile auf den Link ''Deinstallieren'' klicken.
-[[Image:Sonderzeichen.jpg]]
-====Tabelle====
+====Einstellungen====
-<gallery widths="300px">
+*''Symbolleiste des Editors'': In diesem Eingabebereich können Sie eintragen, welche Buttons in der Symbolleiste des TinyMCE-Editors zur Verfügung gestellt werden. Jede Zeile entspricht einer Buttonreihe. Eine Zeile enthält eine kommagetrennte Liste der einzelnen Buttons in der Reihe.
-Image:Tabelle_allgemein.jpg|Allgemein
+*''Verfügbare Zeichensätze'': In diesem Eingabebereich tragen Sie ein, welche Zeichensätze der TinyMCE-Editor bereitstellt.
-Image:Tabelle_erweitert.jpg|Erweitert
+*''Erweiterte Einstellungen'': Hier können Sie weitere Einstellungen für den TinyMCE-Editor vornehmen. Die Einstellungen müssen im JSON-Format eingegeben werden:
-</gallery>
+<pre>{"option1" : "value1", "option2" : "value2"}</pre>
+Alle hier gesetzten Optionen überschreiben die Standard- und Plugineinstellungen.
+Detaillierte Informationen mit Beispielen zu den erweiterten Einstellungen finden Sie in MDL-37186 und auf der [http://www.tinymce.com/wiki.php/Configuration:formats Website von TinyMCE].
-==Systemweite Einstellungen==
+===Formel einfügen===
+Auf der Seite ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Plugins > Texteditoren > Texteditor TinyMCE > Formel einfügen'' können Sie festlegen, ob der [[TeX-Notation|TeX-Filter]] im Kontext des TinyMCE-Editors verwendet werden soll. Wenn Sie diese Checkbox markieren und der TeX-Filter aktiviert ist, dann wird in der Symbolleiste des TinyMCE-Editors der DragMath-Button [[Image:dragmath.png]] zum Einfügen einer Formel angezeigt.
-===Texteditoren verwalten===
+===Emoticon einfügen===
-Administrator/innen können verschiedene Text-Editoren in Moodle aktivieren oder deaktivieren. Klicken Sie dazu im Block ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Plugins > Texteditoren > Übersicht''.
+Auf der Seite ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Plugins > Texteditoren > Texteditor TinyMCE > Emoticon einfügen'' können Sie festlegen, ob das Emoticon-Symbol [[Image:moodleemoticon.png]] in der Symbolleiste des TinyMCE-Editors verfügbar ist. Markieren Sie dazu die Checkbox ''Emoticon-Filter notwendig'' und aktivieren Sie den [[Emoticon als Bild anzeigen|Emoticon-Filter]] im Kontext des TinyMCE-Editors.
-Standardmäßig ist der TinyMCE-editor aktiviert.
-====Rechtschreibprüfung====
+====Systemweite HTML-Einstellungen====
+Administrator/innen können die Emoticons bearbeiten, die in den Texteditoren verwendet werden. Klicken Sie dazu im Block ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Darstellung > HTML-Einstellungen''.
-Der TinyMCE-Editor von Moodle verwendet Google Spell als Standardrechtschreibprüfung. Adminstrator/innen können diese Einstellung auf der Seite ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Plugins > Texteditoren > TinyMCE Editor'' ändern.
+===Rechtschreibung prüfen===
+Auf der Seite ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Plugins > Texteditoren > Texteditor TinyMCE > Rechtschreibprüfung'' können Sie die Rechtschreibprüfung
+konfigurieren:
+*''Rechtschreibprüfung'': Standardmäßig verwendet der TinyMCE-Editor von Moodle Google Spell als Rechtschreibprüfung.
+*''Liste zur Rechtschreibkontrolle'': Hier tragen Sie ein, für welche Sprachen die Rechtschreibprüfung durchgeführt werden soll.
-===Systemweite HTML-Einstellungen===
+==Geschwindigkeit von TinyMCE in Firefox und Chrome==
-Administrator/innen können die Emoticons bearbeiten, die im Text-Editor verwendet werden. Klicken Sie dazu im Block ''[[Einstellungen-Block|Einstellungen]] > Website-Administration > Darstellung > HTML-Einstellungen''.
+Einige Nutzer/innen beklagen sich, dass der TinyMCE-Editor sehr langsam ist (siehe https://moodle.org/mod/forum/discuss.php?d=232089 und https://moodle.org/mod/forum/discuss.php?d=223125).
+Um die Geschwindigkeit zu erhöhen, können Sie alle Plugins des TinyMCE-Editors deaktivieren. Dann stehen einige Funktionen (z.B. Emoticons) nicht zur Verfügung, aber der Editor arbeitet deutlich schneller.
 ==Siehe auch==
 * [http://www.youtube.com/watch?v=xJE6UhqnyjU Video zum Text-Editor in Moodle] (englisch)

Documentation