Unser neuer Editor: der CKEditor 5

  • Die größte Änderung für die Benutzer ist neben der neuen Forumsübersicht mit Echtzeit-Aktualisierung der neue Editor.

    Einen Überblick über alle Änderungen gibt es übrigens auf der Wotlab-Website, nämlich hier.

    Der neue Editor ist ein alter Bekannter, nämlich der CKEditor, der mit Burning Board 4.1 im Jahr 2016 durch den Redactor II ersetzt wurde und jetzt in der aktuellen Version 5 zurückkehrt.

    Umfassende Informationen zum neuen Editor gibt es unter Neuerungen in WoltLab Suite 6.0: CKEditor 5

    Ich zitiere aus dem obigen Link:

    Zitat

    Die aktuelle Version 5 von CKEditor stellt eine vollständige konzeptuelle und technische Neuentwicklung dar. Mit CKEditor 5 wurde ein WYSIWYG-Editor geschaffen, der plattformunabhängig eine stabile und zuverlässige Erstellung und Bearbeitung von (umfangreichen) Texten erlaubt. Die Nutzung der unzuverlässigen „contenteditable“-Schnittstelle wird hierbei nur für das Nötigste verwendet: Die Entgegennahme von Texteingaben sowie die Darstellung des Endergebnisses.

    Für Euch resultieren daraus einige Änderungen:

    • Ein Quellcode-Modus zur Eingabe individueller Formatierungen ist nicht mehr vorhanden (zumindest nicht standardmäßig)
    • Formatierungen aus extern kopierten Texten werden entfernt

    Und der Umgang mit Absätzen hat sich verändert:

    Zitat

    Das Verhalten der Eingabetaste ist vielerorts uneinheitlich: Manchmal erzeugt diese einen einfachen Zeilenumbruch und manchmal entsteht beim Tastendruck ein neuer Absatz. Bei der Verwendung des bisherigen Editors wird bei der Betätigung der Eingabetaste ein neuer Absatz erzeugt, dieser jedoch optisch als reiner Zeilenumbruch dargestellt.

    Absätze werden zukünftig als tatsächliche Absätze dargestellt und verhalten sich so, wie Nutzer es beispielsweise von Textverarbeitungsprogrammen gewohnt sind. Über Shift + Eingabetaste lassen sich auch weiterhin explizite Zeilenumbrüche erzeugen, beispielsweise für die Darstellung von Anschriften. Die korrekte Verwendung von Absätzen verbessert die Interaktion mit anderen Websites und Programmen enorm, Texte werden beim Kopieren und Einfügen üblicherweise korrekt übernommen und erfordern keine Korrekturen der Zeilenumbrüche bzw. Absätze mehr.

    Bereits eingegebene Texte werden automatisch korrigiert:

    Zitat

    Bestehende Texte werden dynamisch korrigiert, damit keine unerwarteten Leerräume zwischen Absätzen entstehen. Diese Kompatibilitätsschicht ermöglicht es, bestehende Texte und Programmlogiken unverändert anwenden zu können und dennoch ein korrektes Endergebnis zu produzieren.

    Auch Überschriften werden jetzt als solche korrekt angezeigt und können z. B. auch durch Suchmaschinen richtig erfaßt werden.

    Wichtig also: Eingabetaste = neuer Absatz, Umschalttaste + Eingabetaste = neue Zeile

    Easy does it.

  • Nun einige Detailinformationen zu den einzelnen Funktionen:

    Wie werden Links erzeugt? Zunächst einmal fällt auf, daß das Link-Symbol nur noch ein Eingabefeld für den Link selbst hat, nicht mehr jedoch für den Linktext.

    Der Linktext wird daher zuerst direkt im Editor eingegeben:

    Der gewünschte Text wird dann markiert und auf das Link-Symbol geklickt, der Link kann dann eingegeben werden:

    Dann auf das Häkchen klicken:

    Somit wurde ein individueller Link erzeugt.

    Easy does it.

  • Für das Einfügen von Bildern empfehle ich nach wie vor unser eigenes Chevereto-basiertes Hosting, die Einbettungslinks können wie bisher direkt im Editor eingegeben werden.

    Wer Bilder lieber direkt anhängt, hat jetzt oben in der Symbolleiste eine neue Option zum Hochladen von Bildern:

    editor4.jpg

    Dies hat einige Vorteile - eine Symbolleiste ermöglicht die individuelle Ausrichtung, zudem kann das Bild einfach mit der Maus auf die gewünschte Größe gezogen werden:

    editor5.jpg

    Wird ein Bild mit dieser Methode hochgeladen, so wird es automatisch im bisherigen und weiterhin vorhandenen Dialogfeld unterhalb des Editors angezeigt:

    editor7.jpg

    Wichtiger Tip für alle, die wie bisher einfügen möchten (die obige Möglichkeit ist aber deutlich besser):

    Auf "Original einfügen" klicken, da sonst nur ein kleines Vorschaubild eingefügt wird.

    Abschließend noch zwei weitere Punkte:

    Zitate werden wie bisher eingefügt, durch Klicken auf dem Pfeil können auch externe Zitate direkt angegeben werden:

    editor6.jpg

    Es ist aber weiterhin möglich, zuerst den Text zu kopieren und dann durch Klicken auf die Kopfzeile des Zitats den Link nachzureichen.

    Und schließlich wird auch weiterhin automatisch gespeichert, falls man versehentlich den Browser schließt:

    editor8.jpg

    Easy does it.