Content Editor
Was ist der Content Editor?
Der Content Editor ermöglicht es basierend auf einem selbst gewählten Layout verschiedene Inhaltselemente in eine Seite einzufügen und so eine Inhaltsseite optimiert für mobile Devices zu gestalten. Eine Speicherung der Änderungen erfolgt automatisch.
Der Content Editor wird an verschiedenen Stellen in OpenOlat verwendet.
Hinweis
Neben dem Content Editor existiert in OpenOlat noch der HTML-Editor "Tiny MC", der z.B. im Kursbaustein "HTML-Seite" verwendet wird.
Wo kommt der Content Editor zum Einsatz?
Der Content Editor wird im Kursbaustein Seite, in der Lernressource "Formular" und im "Portfolio 2.0" verwendet.
Kursbaustein Seite
Der Content Editor wird im Kursbaustein Seite entweder im Kurseditor im Tab "Seiteninhalt" oder bei geschlossenem Kurseditor durch Aktivierung des Bearbeitungsmodus direkt beim gewünschten Kursbaustein Seite aktiviert.
Bei geschlossenem Kurseditor:
Über den Schiebeschalter kann der Bearbeitungsmodus ein- und ausgeschaltet werden.
Im Kurseditor:
Im Kurseditor kann konfiguriert werden, ob neben den Kursbesitzer:innen auch Betreuende den jeweiligen Content Editor des Kursbausteins bei geschlossenem Kurseditor verwenden und Änderungen vornehmen dürfen.
Die Medien-Inhalte des Kursbausteins "Seite" (Bilder, Audio, Video, Diagramme, Zitate, Dokumente, etc.) werden im Media Center, nicht im Ablageordner des Kurses (vergl. Kursbaustein "HTML-Seite"), gespeichert. Weitere Infos finden Sie bei den Erläuterungen zu den jeweiligen Kursbausteintypen.
Für Portfolio und Formular-Lernressource gelten andere Regeln.
Lernressource Formular
Der Content Editor wird auch in der Lernressource Formular und allen Elementen die die Lernressource Formular nutzen verwendet.
Die angezeigten Optionen zum Einfügen von Inhalt sind an das Formular angepasst, z.B. stehen hier verschiedene Fragetypen zur Auswahl.
E-Portfolio
Auch für Einträge in Portfolio-Mappen, die sowohl kursunabhängig als auch in Verbindung mit Portfoliovorlagen und Portfolioaufgaben verwendet werden können, wird der Content Editor verwendet.
Layout im Content Editor
Bevor Sie Inhalte im Content Editor einfügen können, müssen Sie zuerst ein "neues Layout" hinzufügen. Das Layout dient als Raster, das die Anordnung der Inhalte (Blöcke) bestimmt.
Es stehen verschiedene Layouts zur Auswahl, die sich durch unterschiedlich angeordnete Felder unterscheiden. Sie können auf einer Seite auch mehrere Layouts kombinieren.
Falls nötig, lässt sich das Layout später jederzeit ändern. Klicken Sie dazu einfach auf das Zahnrad-Symbol (Einstellungen bearbeiten) des Layouts und wählen Sie ein neues Layout aus.
Sind mehrere Layouts vorhanden, können Sie die Reihenfolge der Layouts ändern. Zum Verschieben eines gesamten Layouts verwenden Sie die Pfeile.
Layout löschen
Über das 3-Punkte-Menü eines Layouts lässt sich jedes Layout der Seite löschen, auch das erste. Beim Löschen entscheiden Sie, was mit dem Inhalt geschieht: "Alles löschen" entfernt das Layout mitsamt seinem Inhalt, "Nur das Layout löschen und den Inhalt verschieben" übernimmt den Inhalt in das angrenzende Layout. Wird das letzte Layout einer Seite gelöscht, weist der Dialog darauf hin, dass das Layout und sein gesamter Inhalt gelöscht werden; die Seite erhält anschliessend automatisch wieder ein leeres Standard-Layout. Ist nur noch ein einziges leeres Layout vorhanden, ist die Aktion "Löschen" deaktiviert.
Inhalte im Layout organisieren
Inhalts-Blöcke
In jeden Bereich eines Layouts können Inhalts-Blöcke mit verschiedenen konkreten Inhalten hinzugefügt werden. Die Anzahl der Inhaltsblöcke variiert je nach gewähltem Design. Ein dreispaltiges Design verfügt dabei beispielsweise über 3 Inhaltsblöcke.
Inhalte in einem Block hinzufügen, positionieren und konfigurieren
Über "Inhalt hinzufügen" werden die konkreten Inhalte und Medien einem Block hinzugefügt.
Sobald ein hinzugefügter Inhalt angeklickt/markiert worden ist, erscheint ein Popup-Fenster, in dem Eigenschaften dieses Inhalts eingestellt werden können. Das ist der sogenannte "Inspektor".
Das Inspektor-Popup lässt sich auch mit dem Zahnrad-Icon des Inhalts ein- und ausblenden.
Menüs
Neben dem Zahnradsymbol gibt es noch ein 3-Punkte Menü und ein Fadenkreuz. Über das Fadenkreuz können weitere Inhaltselemente davor oder danach hinzugefügt oder das markierte Element gelöscht werden. Über das Fadenkreuz kann das markierte Element per Drag & Drop an eine andere Position, einen anderen Inhalts-Block oder ein anderes Layout verschoben werden.
Generelle Formatierungen für alle Inhaltsblöcke - Der Inspektor
Abstände
Für die ansprechende Gestaltung eines Layouts sind einheitliche Abstände zwischen den Feldern des Layouts (Inhaltsblöcken) bedeutsam. Sie haben die Wahl zwischen verschiedenen Abständen:
- kein Abstand
- S (klein)
- M (mittel)
- L (gross)
- XL (extragross)
- benutzerdefiniert
Block-Stil 'Hinweis'
Layouts und verschiedene Inhaltsblöcke können als formatierte Hinweis-Box dargestellt werden . Bei Auswahl eines vordefinierten Hinweis-Typs werden Informationen durch eine entsprechende Farbgebung der Box und mit passendem Icon - deutlich hervorgehoben. Ein Set an weiteren Farben und Icons zur benutzerdefinierten Gestaltung der Box ist ebenfalls verfügbar. Auf Wunsch kann eine Box auch einklappbar gemacht werden.
Beispiel:
Anker
Alle Titel-Elemente einer Seite werden automatisch mit Ankern (Sprungzielen) versehen , so dass innerhalb der Seite direkt zu einem Abschnitt gesprungen werden kann.
Inhaltstypen
Bitte beachten Sie, dass nicht in jedem Content Editor alle Elemente zur Verfügung stehen.
Titel
Für das Überschriftselement sind verschiedene Schriftgrössen vordefiniert.
Text
Hierüber werden Texte hinzugefügt.
Tabelle
Mathematische Formel
Für mathematische Formeln steht ein spezieller kleiner Editor zur Verfügung.
Dieses Textelement existiert nicht im Formular Editor.
Code-Beispiel
Der 'Code' Block ermöglicht die Textdarstellung in einer Schriftart mit festen Abständen und Nummerierung der Zeilen. Dies ist insbesondere bei technischen Lerninhalten wie Programmierbeispielen sehr hilfreich. Beim Anlegen des Code Blocks kann die verwendete Programmiersprache gewählt werden. Zur Weiterverarbeitung können Teilnehmende die Code-Vorlage direkt in die Zwischenablage kopieren.
Dieses Textelement existiert nicht im Formular Editor.
Zitat
Wird ein Text als Zitat erfasst, hat er automatisch eine vordefinierte Formatierung. Die Zitate werden wie Audios oder Videos als wiederverwendbare Objekte im Medien Center gespeichert.
Dieses Textelement existiert nicht im Formular Editor.
Bereich Medien
Statt des Bereichs Medien mit den zugehörigen Inhaltselementen gibt es im Formular Editor die Bereiche "Fragetypen" und "Organisatorisch" mit entsprechenden Inhaltselementen.
Bild
Alle im Medien Center verfügbaren Bilder können eingebunden werden. Neue Bilder lassen sich hochladen und werden automatisch im Medien Center abgelegt. Unterstützt werden die Bildformate png, jpg, gif und svg .
Galerie
Mehrere Bilder können in einem Galerie-Element durchgeblättert werden (Slideshow), in einem Raster dargestellt werden (Spalten und Zeilen von Autor:innen definierbar) oder mit Vorschau dargestellt werden (1 Bild gross, die übrigen Bilder als verkleinerte Vorschaubilder). Im Inspektor kann das Erscheinungsbild der Galerie variiert werden. Die Bilder entstammen dem Medien Center.
Bildervergleich
Zwei übereinander liegende Bilder können durch einen Schieberegler überblendet werden.
Audio
Audios können direkt in OpenOlat neu aufgenommen, hochgeladen oder aus den bereits vorhandenen Audios ausgewählt werden.
Video
Im Block 'Video' können auch Videos per URL eingebunden werden.
Unterstützt werden die Video-Formate MP4 und m3u8 sowie die Plattformen YouTube, Vimeo, Panopto und nanoo.tv. Auch die Aufzeichnung neuer Videos direkt in OpenOlat ist möglich.
Dokument
Hier können Dokumente in verschiedenen Formaten (z.B. PDF- oder Word-Dateien) per Drag & Drop hochgeladen, aus dem Medien Center ausgewählt oder in bestimmten Formaten direkt erstellt werden. Die Medien werden automatisch im Medien Center abgelegt.
Über das Inspektor-Menü haben Sie ebenfalls Zugriff auf das Medien Center, um den Dokumenten zusätzliche Informationen hinzuzufügen und weitere Freigaben zu definieren. Eine Datei, die zunächst nur für einen Inhaltsblock vorgesehen war, kann dadurch auch anderweitig genutzt oder von anderen OpenOlat-Benutzer:innen bearbeitet werden.
Zusätzlich besteht im Bereich "Share" die Möglichkeit, für neu erstellte oder hochgeladene Dokumente direkt eine Freigabe zu erteilen.
Diagramm (draw.io.)
Es können bereits vorhandene Diagramme aus dem Medien Center geladen werden oder direkt neue Diagramme mit draw.io erstellt werden. Wenn Sie als Einzelperson die Datei bearbeiten, findet die Bearbeitung auf dem OpenOlat-Server statt, im Kollaborationsmodus auf einem externen Server.
Bereich Wissen
Dieser Bereich existiert nur im Content Editor des Kursbausteins Seite.
Quiz
Mit diesem Inhaltselement können automatisiert auswertbare Quizfragen in eine Seite eingebunden werden. Sie haben die Möglichkeit, neue Fragen zu erstellen oder bestehende Fragen aus dem Fragenpool hinzuzufügen. Zu jeder Frage lassen sich zudem Feedbacks ergänzen, inklusive Bildern und Videos, was den Lernwert steigert.
Diese kleinen Quizfragen sollen die Auseinandersetzung mit den Inhalten fördern, vergeben jedoch keine Punkte. Für bewertbare Quizfragen nutzen Sie bitte die Kursbausteine "Test" oder "Selbsttest".
Separator
Ein Separator ist eine Linie (optisches Gestaltungselement) zur Trennung von Inhalten.
Inhaltsverzeichnis
Das Element "Inhaltsverzeichnis" macht lange Seiten übersichtlich: Es listet die Titel der Seite als anklickbare Sprungmarken auf und führt mit einem Klick direkt zum jeweiligen Abschnitt . Erfasst werden die Titel, die auf der Seite nach dem Inhaltsverzeichnis folgen, bis zum nächsten Titel gleicher oder höherer Stufe. So lässt sich ein Verzeichnis für die ganze Seite oder nur für ein einzelnes Kapitel erstellen. Im Inspektor legen Sie unter "Titelgrössen" fest, welche Titelstufen (H1 bis H5) im Verzeichnis erscheinen; standardmässig sind H1 bis H4 ausgewählt. Wird das Inhaltsverzeichnis als Hinweis-Box dargestellt, dient sein Titel als Titel der Box.
Dieses Element existiert nicht im Formular Editor.
HTML-Textcode
Ausschliesslich im Editor des Kursbausteins Seite gibt es noch den HTML-Textcode Editor. Er übernimmt ähnliche Funktionen wie das Inhaltselement "Text" bietet aber noch weitere Menüs und Möglichkeiten.
KI-Feedback zu Freitextantworten
Ist im KI Modul die KI Funktion "Essay Bewertung" konfiguriert, lassen sich einem Quiz auch Freitextfragen hinzufügen . Beantworten Lernende eine solche Frage, können sie unter "KI-Feedback" ein formatives Feedback zu ihrer Antwort abrufen. Es umfasst eine "Gesamteinschätzung", "Was gut gelungen ist", "Was fehlt noch" sowie den Abschnitt "Nächster Schritt", wahlweise als "Zusammenfassung" oder "Detailliertes Feedback". Das Feedback vergibt keine Punkte und dient der Selbsteinschätzung.
Import von Markdown- und Word-Dateien
Wichtig
Markdown ist ein weit verbreitetes Textformat, das in vielen Tools und KI-Anwendungen ausgegeben wird. Es ermöglicht die nahtlose Übernahme und Weiterverwendung bestehender Inhalte ohne zusätzlichen Formatierungsaufwand. Gleichzeitig unterstützt es eine klare Struktur und erleichtert die kontinuierliche Weiterentwicklung von Lerninhalten.
Markdown-Dateien und Word-Dokumente können direkt im Content Editor importiert werden, wodurch sich Inhalte aus externen Werkzeugen, Textdateien oder KI-Anwendungen ohne manuelles Nachformatieren übernehmen lassen. Der Inhalt wird automatisch in das strukturierte Seitenformat überführt und bildet so eine effiziente Grundlage, um Kursseiten schneller und einfacher mit Inhalten zu befüllen.
Klicken Sie zum Import auf den Button "Importieren" am unteren Rand des Content Editors. Im Feld "Importmodus" wählen Sie zwischen zwei Varianten:
A) Datei hochladen: (Unterstützt werden)
- Markdown-Dateien (.md, .markdown, .txt)
- ZIP-Archive bis maximal 50 MB (Ein ZIP-Archiv muss genau eine Markdown-Datei enthalten und kann zusätzlich die darin relativ referenzierten Bilddateien mitliefern.)
- Word-Dokumente (.docx) bis maximal 200 MB .
B) Text einfügen: Markdown-formatierter Text wird direkt in das Eingabefeld eingefügt, z.B. aus der Zwischenablage. Lokale Bildpfade werden in diesem Modus nicht unterstützt.
Word-Dokumente importieren
Word-Dokumente werden beim Import automatisch in Markdown umgewandelt und durchlaufen anschliessend dieselbe Verarbeitung wie Markdown-Dateien. Formatierungen wie hochgestellter, tiefgestellter, unterstrichener und hervorgehobener Text bleiben dabei ebenso erhalten wie Tabellen und eingebettete Bilder. Beim Hochladen einer .docx-Datei zeigt OpenOlat einen Hinweis an, da nicht alle Word-Funktionen übernommen werden können. Prüfen Sie die importierten Inhalte deshalb sorgfältig.
Umwandlung der Elemente
Die Markdown-Elemente werden beim Import wie folgt in Blöcke des Content Editors umgewandelt:
Die Titelgrösse steuert zugleich, welche importierten Titel das Element "Inhaltsverzeichnis" erfasst und als Sprungmarken verlinkt.
Markdown-Erweiterungen
Zusätzlich werden die Markdown-Erweiterungen für durchgestrichenen Text, Task-Listen und Fussnoten unterstützt. GitHub-Admonitions der Typen NOTE, TIP, IMPORTANT, WARNING, CAUTION, INFO, SUCCESS und ERROR erhalten eine Hinweis-Box mit passendem Typ und Icon; bei MkDocs-Admonitions kommen weitere Typen wie ABSTRACT, HINT, QUESTION, ATTENTION, DANGER, BUG oder EXAMPLE hinzu. Ein Admonition-Titel in Anführungszeichen wird übernommen, ein leerer Titel "" blendet die Titelzeile aus, ohne Titelangabe erscheint die Standardbezeichnung des Typs. HTML-Blöcke werden aus Sicherheitsgründen nicht übernommen; der Import schliesst mit einer entsprechenden Warnung ab.
Bilder beim Import
Bilder werden direkt ins Media Center eingebunden, wobei eine Duplikats-Prüfung verhindert, dass das selbe Bild mehrfach im Media Center abgelegt wird. So wird Platz gespart und automatisch aufgeräumt, ohne dass man sich als Autor:in darum kümmern muss.
Bilder mit absoluten URLs werden beim Import heruntergeladen, sofern die Administrator:innen die jeweilige Domain für externe Medien freigegeben haben. Auch direkt im Markdown eingebettete Base64-Bilder (Data-URIs) werden übernommen.
Ist das KI Modul mit der KI Funktion "Bildbeschreibungs-Generator" konfiguriert, werden für importierte Bilder die Metadaten (Alt-Text, Beschreibung, Schlagwörter) im Hintergrund automatisch per KI erzeugt . Dabei wird eine verkleinerte Version des Bildes an den KI-Dienst übertragen. Details zu Metadaten mit KI >
Import an einer bestimmten Position
Der Button "Importieren" steht zusätzlich im Dialog "Inhalt hinzufügen" zur Verfügung . Beim Import über diesen Dialog wird der Inhalt genau dort eingefügt, wo Sie gerade arbeiten: im jeweiligen Inhalts-Block bzw. vor oder nach dem Element, über das der Dialog geöffnet wurde. Beim Import über den Button am unteren Rand des Content Editors werden die Inhalte am Seitenende eingefügt.
KI-Fragen beim Import erzeugen
Ist das KI Modul mit den KI Funktionen "Essay Fragen Generator" und "Essay Bewertung" konfiguriert, können Sie im Import-Dialog zusätzlich die Option "KI-generiertes Quiz hinzufügen" aktivieren . OpenOlat erzeugt dann aus dem importierten Inhalt Fragen und fügt sie als Quiz-Element am Seitenende an. Über die Felder "MC-Fragen" und "Essay-Frage mit KI-Korrektur" legen Sie fest, wie viele Fragen je Typ erzeugt werden (bis zu fünf pro Typ).
Die Generierung läuft im Hintergrund und kann eine Minute dauern; das Quiz-Element erscheint, sobald die Fragen bereit sind. Prüfen Sie die erzeugten Fragen anschliessend auf inhaltliche Korrektheit. Im E-Portfolio steht die KI-Fragengenerierung nicht zur Verfügung.
Media Center
Im Content Editor des Kursbausteins Seite und des Portfolios gibt es noch einen separaten Button, der zum Media Center führt. Im Prinzip handelt es sich dabei um einen weiteren Weg unabhängig von der Art des Mediums auf die Dateien zuzugreifen.
Mit Klick auf den Link erhalten Sie Zugriff auf die Dateien Ihres Media Centers. Hier können Sie Dateien auswählen, erstellen oder hochladen.
Weiterführende Informationen
Kursbaustein Seite >
Lernressource Formular >
Portfolio >
Medien Center (Persönliche Werkzeuge)>
Ausführliche Informationen zum Media Center (Basiskonzept) >