Neue Benutzeroberfläche v13
Die Administrationsoberfläche hat sich visuell zwischen Version 11 und Version 13 weiterentwickelt. Obwohl die allgemeine Ergonomie und die Anordnung der Elemente identisch bleiben, wurde das Erscheinungsbild modernisiert, um die Lesbarkeit zu verbessern. Nachfolgend erläutern wir die visuellen Änderungen der vier Hauptbereiche der Oberfläche.
1 - Obere Werkzeugleiste
Das schwarze obere Banner wurde durch eine helle Benutzeroberfläche ersetzt. Die wichtigste funktionale Änderung betrifft die Suchfunktion. Das in v11 sichtbare Texteingabefeld wurde durch ein Lupen-Symbol oben rechts ersetzt. Es ist erforderlich, auf dieses Symbol zu klicken oder das zugehörige Tastenkürzel zu verwenden, um die globale Suchleiste zu öffnen. Die Funktionen für das Benutzerprofil und das Leeren des Caches behalten ihren gewohnten Platz auf der rechten Seite.
2 - Modulmenü
Das Hauptnavigationsmenü in der linken Spalte verzichtet auf den dunklen Hintergrund zugunsten eines hellgrauen Hintergrunds. Die Modul-Icons (Seite, Liste, Dateien) wurden neu gestaltet. Ihre Reihenfolge und ihre Funktionen bleiben unverändert. Die Module zur Inhaltsverwaltung befinden sich weiterhin im oberen Bereich, während sich das Dateiverwaltungsmodul im unteren Bereich dieser Zone befindet.
3 - Seitenbaum
Die Baumstruktur zur Navigation innerhalb der Website-Struktur weist eine Änderung der Positionsanzeige auf. Die aktuell aktive Seite (diejenige, die gerade bearbeitet wird) wird nun durch ein blaues Farbbanner hervorgehoben. Diese visuelle Unterscheidung ersetzt die einfache Graudarstellung der vorherigen Version und ermöglicht es, die ausgewählte Seite im Seitenbaum schneller zu erkennen.
Eine zusätzliche visuelle Kennzeichnung wurde in Bezug auf den Seiteninhalt hinzugefügt. Wenn eine Seite ein spezifisches Plugin enthält (wie eine Nachrichtenliste oder ein Ereignis), wird nun ein kleines Logo auf der Seiten-Icon-Ebene angezeigt. Dadurch kann das Vorhandensein besonderer Funktionen erkannt werden, ohne den detaillierten Inhalt aufrufen zu müssen.
4 - Bearbeitungsbereich
Der zentrale Bereich, in dem die Inhaltsverwaltung erfolgt, wurde neu organisiert, um die Elemente besser voneinander abzugrenzen. Die Inhaltsblöcke werden in Form von einzelnen Karten auf grauem Hintergrund dargestellt, was die Unterscheidung zwischen den verschiedenen Absätzen oder Bildern verbessert. Die Schaltflächen zum Hinzufügen von Inhalten wurden vergrößert. Anstelle der kleinen Schaltfläche + Inhalt steht nun zwischen jedem Block eine große Schaltfläche mit der Bezeichnung Neuen Inhalt erstellen zur Verfügung, was das Einfügen neuer Elemente erleichtert.
Anzeigemodus (Hell / Dunkel)
TYPO3 v13 bietet nun ein dunkles Design für die Administrationsoberfläche. Standardmäßig passt sich die Anzeige automatisch an die Einstellungen Ihres Betriebssystems an, aber Sie können den gewünschten Modus manuell erzwingen. Klicken Sie dazu auf Ihr Benutzerprofil (Ihr Name und Avatar) in der Werkzeugleiste oben rechts:
Ein Dropdown-Menü erscheint und enthält Ihre Einstellungen. Eine dedizierte Option ermöglicht es Ihnen, die Anzeige umzuschalten. Klicken Sie auf den Schalter, der Hellmodus oder Dunkelmodus anzeigt, um zwischen den beiden Erscheinungsbildern zu wechseln.
Sobald der Dunkelmodus aktiviert ist, wechselt die gesamte Benutzeroberfläche (Menüs, Seitenbaum und Bearbeitungsbereiche) zu dunklen Farbtönen und bietet einen besseren Sehkomfort in schwach beleuchteten Umgebungen:
Vorschau des Dunkelmodus:
Globale Suche
Die Suchfunktion wurde zentralisiert und modernisiert, um die schnelle Navigation innerhalb der Website zu erleichtern. Sie ist über das Lupen-Icon in der oberen Werkzeugleiste oder über das Tastenkürzel Strg + K (oder Cmd + K) zugänglich.
Die Suchoberfläche öffnet sich nun in einem dedizierten Fenster in der Mitte des Bildschirms, das sich über Ihre laufende Arbeit legt:
Im Gegensatz zu früheren Versionen durchsucht diese Suche die gesamte Website: Sie ermöglicht es, nicht nur Seitentitel, sondern auch spezifische Inhaltselemente (Texte, Titel) oder Dateien zu finden. Die Ergebnisse werden dynamisch angezeigt und nach Typ klassifiziert. Ein Klick auf ein Ergebnis leitet Sie direkt zum betreffenden Element zur Bearbeitung weiter.
Dateiverwaltung (Filelist)
Das Dateiverwaltungsmodul profitiert von der globalen grafischen Überarbeitung der Version 13, was die Handhabung von Medien und Dokumenten erleichtert.
1 - Ordnerbaum
Die linke Spalte zeigt die Verzeichnisstruktur des Servers. Ein Filterfeld mit der Bezeichnung "Geben Sie den zu suchenden Begriff ein" ist oben im Baum verfügbar. Diese Funktion ermöglicht es, die Ordnerliste in Echtzeit zu filtern, um schnell auf ein bestimmtes Verzeichnis zuzugreifen, ohne die gesamte Hierarchie manuell durchsuchen zu müssen.
2 - Anzeige und Aktionen
Der zentrale Bereich zeigt den Inhalt des ausgewählten Verzeichnisses an. Die Oberfläche hebt eine Anzeige in Form von "Kacheln" (Vorschaubildern) hervor, die eine schnelle visuelle Identifikation von Ordnern und Dateien ermöglicht. Eine kontextbezogene Suchleiste ermöglicht es, die im aktuellen Ordner sichtbaren Elemente zu filtern. Die Hauptaktionen wie "Dateien hochladen" oder einen "Neuen Ordner" erstellen sind nun direkt über die Schaltflächen in der oberen Werkzeugleiste zugänglich.
Verschieben von Inhalten zwischen Seiten (Drag-and-drop)
Version 13 vereinfacht das Verschieben eines Elements von einer Seite zur anderen. Es ist nicht mehr notwendig, die Funktionen "Ausschneiden" und "Einfügen" zu verwenden. Sie können nun die Drag-and-drop-Funktion direkt aus dem Bearbeitungsbereich in den Seitenbaum verwenden.
Um einen Block zu verschieben:
- Klicken Sie auf die obere Leiste des Inhaltselements (den Kopfbereich des Blocks) und halten Sie die Maustaste gedrückt.
- Ziehen Sie das Element in die linke Spalte (Seitenbaum), bis Sie die gewünschte Zielseite erreichen.
- Lassen Sie die Maustaste los, sobald die Zielseite hervorgehoben ist.
Ein Bestätigungsfenster wird angezeigt, um das Verschieben zu bestätigen. Der Inhalt wird dann von der Ursprungsseite entfernt und auf der neuen Seite platziert.
Rich-Text-Editor (RTE)
Das Redaktionswerkzeug wurde auf eine neuere und leistungsfähigere Version aktualisiert (CKEditor 5). Dieses Update bringt eine leichtere Benutzeroberfläche und eine bessere Stabilität bei der Erstellung von Inhalten.
Vereinfachte Werkzeugleiste
Die Werkzeugleiste wurde neu organisiert, um eine bessere Lesbarkeit zu bieten. Die Formatierungs-Icons (Fett, Kursiv, Listen, Links) sind in einer einzigen Zeile oben im Eingabebereich gruppiert. Die Schaltfläche "Source" ganz links ermöglicht weiterhin den Wechsel zur HTML-Ansicht für technische Korrekturen.
Kopieren/Einfügen aus Word
Der Import von Text aus externen Programmen wie Microsoft Word oder Google Docs wurde erheblich verbessert. Sie können Ihren Text nun direkt in den Editor einfügen, ohne über spezifische "Bereinigungs"-Schaltflächen gehen zu müssen. Das System erkennt die Quelle automatisch und behält die Struktur (Überschriften, Absätze, Fett) bei, während es unnötigen störenden Code entfernt, der die Darstellung Ihrer Website verfälschen könnte.
Bearbeitung von Links und Tabellen
Das Verhalten bei der Bearbeitung von Elementen hat sich geändert. Ein Rechtsklick öffnet nicht mehr systematisch das Menü des Editors (er öffnet oft das Browsermenü). Um nun einen bestehenden Link oder die Eigenschaften einer Tabelle zu ändern, führen Sie einen einfachen Linksklick auf das Element aus. Eine kleine kontextbezogene Werkzeugleiste (Tooltip) erscheint sofort neben dem ausgewählten Element und bietet Ihnen die Bearbeitungsoptionen an.
Hinzufügen von Plugins (News)
Die Methode zum Einfügen komplexer Elemente, wie News oder Veranstaltungen, wurde im Assistenten zur Erstellung von Inhalten vereinfacht.
Bisherige Funktionsweise (v11)
Früher erfolgte das Hinzufügen eines Plugins in zwei Schritten. Zuerst musste man im Reiter "Module" das generische Modul News-Verwaltung auswählen. Erst nachdem das Element zur Seite hinzugefügt wurde, musste man über eine Dropdown-Liste in den Plugin-Eigenschaften den Anzeigetyp (Listenansicht, Detailansicht, Datumsmenü usw.) festlegen.
Aktuelle Funktionsweise (v13)
Der Assistent zur Erstellung von Inhalten zeigt nun direkt alle verfügbaren Anzeige-Kombinationen an. Es ist nicht mehr notwendig, über ein generisches Modul zu gehen. Sie können den gewünschten Rendertyp sofort auswählen, zum Beispiel Liste der News-Artikel, Detailansicht des Artikels oder Kategorienmenü direkt aus der Auswahlliste. Das Element wird somit direkt mit der richtigen Konfiguration erstellt, wodurch ein Konfigurationsschritt entfällt.
Verschiedene Änderungen
Ansichts- und Sprachauswahl
Die Kopfzeile des Moduls Seite wurde neu organisiert, um die Verwaltung der Ansicht von der der Sprachen zu trennen.
- Menü "Layout": Diese Schaltfläche ermöglicht es, den Anzeigemodus der Seite festzulegen (in der Regel die Spaltenansicht für die Standardbearbeitung). Sie ersetzt das ehemalige Menü "Funktionen".
- Menü "Sprache": Rechts neben dem Ansichtsselektor befindet sich dieses neue dedizierte Menü, mit dem zwischen den verfügbaren Sprachen umgeschaltet oder der Vergleichsmodus (Seitenansicht nebeneinander) aktiviert werden kann, ohne Ihre Arbeitsumgebung zu verlassen.