Bereits mit TYPO3 4.5 wurde im Januar 2011 ein neuer Seitenbaum auf Basis von ExtJS und Ext.Direct im TYPO3 Backend eingeführt.
Dieser neue Seitenbaum bringt einige Vorteile, die aber zum Teil nicht auf den ersten Blick ersichtlich sind. Auf die vielen neuen Features will ich im ersten Adventskalender Türchen eingehen.
Neue Seiten per Drag & Drop anlegen
Die wohl nützlichste Neuerung dürfte das Drag & Drop Feature sein, mit dem sich Seiten anlegen, verschieben, löschen und kopieren lassen. Nach einem Klick auf das Icon mit dem grünen Plus links oben im Seitenbaum erscheint ein Toolbar mit Icons für die verschiedenen Seitentypen. Mit klicken und ziehen kann man das Icon dann an die Stelle im Seitenbaum ziehen, wo eine neue Seite oder ein neuer Ordner angelegt werden soll. Eine dünne grau Linie zeigt die Stelle, an der die neue Seite eingefügt wird. Direkt nach dem Einfügen der Seite in den Seitenbaum wird der Seitenbaum aktualisiert und es erscheint die neue Seite, per Default versteckt. Außerdem hat man direkt im Seitenbaum die Möglichkeit, den Titel der Seite zu setzen, da automatisch ein editierbares Textfeld erscheint.
Seitentitel direkt im Seitenbaum ändern
Auch die Titel von bestehenden Seiten lassen sich im Seitenbaum ganz fix ändern. Dazu muss nur doppelt auf den Seitentitel geklickt werden und voilà, wieder erscheint das Textfeld zum Ändern des Titels. Mit Enter wird die Änderung des Titels bestätigt, mit Escape kann man den Bearbeitungsmodus ohne Änderung verlassen.
Seiten verschieben und kopieren
Um eine Seite an eine andere Stelle im Seitenbaum zu verschieben, zieht man den Seitentitel einfach an die gewünschte neue Stelle und lässt die Seite dort los. Wenn die Seite kopiert werden soll, muss während des Ziehens nur ein Mal die Strg Taste gedrückt werden.
Der Drag & Drop Vorgang kann jederzeit mit der Escape Taste abgebrochen werden.
Löschen von Seiten
Per Drag & Drop können auch Seiten aus dem Seitenbaum gelöscht werden. Während eine Seite gezogen wird, erscheint unterhalb des Seitenbaums eine dunkelgraue Fläche. Dort abgelegte Seiten werden gelöscht. Falls eine Seite dort versehentlich abgelegt wurde, kann der Löschvorgang noch einige Sekunden lang rückgängig gemacht werden. Danach muss der Papierkorb von TYPO3 bemüht werden.
TYPO3 merkt sich den Zustand des Seitenbaums
Wie auch schon in früheren Versionen von TYPO3 merkt sich der Seitenbaum den aktuellen Zustand, also welche Teilbäume ausgeklappt sind. Zusätzlich merkt sich TYPO3 jetzt auch die zuletzt angeklickte Seite und öffnete diese auch nach einem erneuten Login als erstes.
Filtern des Seitenbaums
Ein großartiges neues Feature sind die Möglichkeiten, die Seiten im Seitenbaum zu filtern. Bislang funktionierte die Filterung nur für Seiten, die auch ausgeklappt und somit sichtbar waren. Jetzt wird wirklich der gesamte Seitenbaum durchsucht.
Die Filterfunktion wird über das Filter Icon über dem Seitenbaum gestartet. Sobald mehr als drei Zeichen eingegeben wurden, wird der Filter Modus gestartet und es werden nur noch Seiten im Seitenbaum angezeigt, die die gesuchte Zeichenkette enthalten bzw. der Klickpfad zu diesen Seiten. Die genauen Treffer werden farblich hervorgehoben. Anstelle von Buchstaben können auch Seiten IDs direkt eingegeben werden. In diesem Fall entfällt das drei Zeichen Limit zum Starten des Filter Modus.
Kontext Menü
Zusätzlich zum eigentlichen Seitenbaum wurde auch das Kontext Menü überarbeitet. Es ist über einen Links- oder Rechtsklick auf das Icon oder den Seitentitel aufrufbar. Sofort sichtbar sind die Funktionen, die nicht über die Drag & Drop Funktionalität abgedeckt sind. Dazu gehören die Vorschau, das Aktivieren oder Deaktivieren von Seiten und andere Funktionen. Im Bereich „Seitenaktionen“ befinden sich die Funktionen, die auch per Drag & Drop genutzt werden können. Unter „Teilbereichsaktionen“ verbergen sich noch nützliche weitere Funktionen wie das Ein- und Ausblenden gesamter Teilbäume inklusiver aller Unterbäume und der Import und Export als t3d Datei.
Das Kontext Menü kann durch eigene Aktionen erweitert werden. Im TYPO3Wiki findet sich ein Artikel mit einer Demo Extension und Beispielcode.
Temporäre Datenbankfreigabe
Wer oft mit umfangreichen Seitenbäumen zu tun hat, wird sich über eine weitere Funktion aus dem Untermenü „Teilbereichsaktionen“ freuen. Über den Menüpunkt „Als Startpunkt für den Seitenbaum festlegen“ kann eine beliebige Unterseite als Startseite festgelegt werden. Der restliche Seitenbaum wird dann ausgeblendet. Der Zustand der temporären Datenbankfreigabe bleibt natürlich auch nach einem erneuten Login erhalten.
Datenbankfreigaben für Redakteure
Bei Datenbankfreigaben für Redakteure funktionieren alle oben beschriebenen Funktionen genauso.
Eine kleine Verbesserung bietet die Benutzer TypoScript Option „options.pageTree.showPathAboveMounts = 1“. Sie kann sowohl auf Benutzer- als auch auf Gruppenebene benutzt werden und sorgt dafür, dass der Pfad zur jeweiligen Startseite der Datenbankfreigabe über dem Teilbaum angezeigt wird.
Weitere Anpassungsmöglichkeiten über Seiten TS
Bereits beim letzten Adventskalender wurden Möglichkeiten vorgestellt, die Darstellung des Seitenbaums zu beeinflussen (Türchen 3 & Türchen 10). Diese Möglichkeiten funktionieren auch weiterhin (im TS Config Feld der Gruppe oder des Benutzers).
Folgende Optionen gibt es:
- options.pageTree.showPathAboveMounts = 1
Zeigt wie bereits oben beschrieben den den Pfad einer Datenbankfreigabe an - options.pageTree.showPageIdWithTitle = 1
Zeigt die Seiten ID in eckigen Klammern vor dem Seitentitel an - options.pageTree.showNavTitle = 1
Zeigt den Navigationstitel statt dem Seitentitel im Seitenbaum an - options.pageTree.disableIconLinkToContextmenu = 1
Schaltet die Aktivierung des Kontext Menüs mit der linken Maustaste aus - options.pageTree.hideFilter = 1
Versteckt die Filter Funktion - options.pageTree.showDomainNameWithTitle = 1
Zeigt den Namen des Domain Datensatzes im Seitentitel an (siehe Screenshot) - options.contextMenu.table.pages.disableItems =
Kommaseparierte Liste von Elementen, die nicht im Kontext Menü verfügbar sein sollen (view, disable, enable, edit, info, history, new, cut, copy, pasteInto, pasteAfter, delete, mountAsTreeroot, expandBranch, collapseBranch) - options.pageTree.doktypesToShowInNewPageDragArea =
Kommaseparierte Liste von Doktype IDs, die in dem Toolbar mit Icons für neue Seiten angezeigt werden sollen. Default Werte sind 1, 6, 4, 7, 3, 254, 255, 199
Preloading des Seitenbaums
Damit sich der Seitenbaum ohne große Verzögerungen benutzen lässt, wird er zum Teil voraus geladen. Per default sind das 50 Seiten. Der Wert kann über einen Eintrag in der localconf.php verändert werden:
$GLOBALS['TYPO3_CONF_VARS']['BE']['pageTree']['preloadLimit'] |
Beim Ändern dieses Wertes ist aber Vorsicht geboten, da sich die Anzahl der Datenbankabfragen entsprechend erhöht.
Weiterentwicklung des Seitenbaums
Mit Version 4.6 wurden Bugs behoben und die Performance verbessert. Für TYPO3 4.7 ist die Portierung auf ExtJS 4 geplant.
Sehr praktisch fände ich es, wenn es möglich wäre, die Technologie, die hinter dem neuen Seitenbaum steckt, auch für eigene Bäume nutzen zu können. Dies ist momentan aber leider noch nicht möglich.
Ein großes Dankeschön geht auf jeden Fall an alle Entwickler, die an der Implementierung des neuen Seitenbaums beteiligt waren! Super Arbeit!