Listenkomponente list-component
Die Kernkomponente „Listenkomponente“ ermöglicht die einfache Erstellung dynamischer sowie statischer Listen.
Nutzung usage
Die Listenkomponente kann beispielsweise zum Erstellen einer dynamischen Liste von untergeordneten Seiten oder einer statischen Liste von willkürlich definierten Elementen verwendet werden. Der Typ der verfügbaren Listen und Formatierungsoptionen kann vom Vorlagenautor im Dialogfeld „Design“ definiert werden. Der Inhaltseditor kann aus verfügbaren Listentypen und Elementen zum Formatieren der Listen im Dialogfeld „Bearbeiten“ auswählen.
Version und Kompatibilität version-and-compatibility
Die aktuelle Version der Listenkomponente ist v4, die mit Version 2.22.0 der Kernkomponenten im Februar 2023 eingeführt wurde und in diesem Dokument beschrieben wird.
Die folgende Tabelle enthält alle unterstützten Versionen der Komponente, die AEM-Versionen, mit denen die Versionen der Komponente kompatibel sind, sowie Links zur Dokumentation für frühere Versionen.
Weitere Informationen zu Kernkomponentenversionen und -freigaben finden Sie in den Kernkomponentenversionen.
Redirects in Listen redirects
Wenn eine Seite ein Redirect-Ziel hat (unabhängig davon, ob sie auf eine externe URL oder eine andere AEM verweist), dann verweist eine Liste mit Links darauf direkt auf die URL des Redirect-Ziels.
Beispiel redirect-example
- Erstellen Sie eine Seite A, die zu Seite B umleitet.
- Erstellen Sie eine Seite C, die zu
https://aemcomponents.devumleitet. - Fügen Sie auf einer Seite D eine Listenkomponente ein, die die Seiten A und C enthält.
- Die entsprechenden generierten Links verweisen dann direkt auf Seite B und
https://aemcomponents.dev
Musterkomponentenausgabe sample-component-output
Um die Listenkomponente und Beispiele für die Konfigurationsoptionen sowie HTML- und JSON-Ausgaben zu erhalten, besuchen Sie die Komponentenbibliothek.
Technische Details technical-details
Die aktuelle technische Dokumentation zur Listenkomponente finden Sie auf GitHub.
Weitere Informationen zur Entwicklung von Kernkomponenten finden Sie in der Dokumentation zu Kernkomponenten für Entwickler.
Dialogfeld „Bearbeiten“ edit-dialog
Im Dialogfeld „Bearbeiten“ kann der Inhaltsautor die Liste und die Listenelemente konfigurieren.
Registerkarte „Listen-Einstellungen“ list-settings-tab
Die Liste kann auf verschiedene Weise erstellt werden.
Unabhängig davon, wie die Liste erstellt wurde, stehen Optionen für Sortieren und ID zur Verfügung, die immer konfiguriert werden können.
Je nachdem, wie der Inhaltsautor die Liste erstellt, werden die zusätzlichen Konfigurationsoptionen geändert.
Untergeordnete Seiten child-pages
Die Liste kann aus den untergeordneten Seiten der aktuellen Seite oder einer anderen Seite bestehen.
-
Übergeordnete Seite
- Die Seite, deren untergeordnete Seiten in die Liste aufgenommen werden sollen
- Frei lassen, um aktuelle Seite zu verwenden
-
Untergeordnete Tiefe,
Wie viele Ebenen in der Hierarchie angelegt werden sollten
Liste fester Werte fixed-list
Die Liste kann mit einer Liste mit festen Elementen erstellt werden.
Tippen oder klicken Sie auf die Schaltfläche Hinzufügen, um ein neues Element in die Liste einzufügen.
-
Geben Sie im Feld Link eines der folgenden Elemente ein
- Eine vollständig qualifizierte URL
- Eine relative URL zu einem vorhandenen AEM-Inhalt
- Sie können das Dialogfeld Auswahl verwenden, um ein Element aus AEM auszuwählen.
-
Geben Sie in das Feld Text den Text ein, der für den Link in der Liste angezeigt werden soll.
-
Aktivieren Sie das Kontrollkästchen, wenn der Link in einer neuen Browser-Registerkarte geöffnet werden soll
Sobald mehrere Elemente für die Liste erstellt wurden, können Sie die Liste anordnen.
- Mit dem Ziehpunkt können Sie die Elemente in der Liste neu anordnen.
- Verwenden Sie das Papierkorbsymbol, um Elemente in der Liste zu löschen.
Suche search-options
Die Liste kann mithilfe der Ergebnisse einer Suche aus AEM-Inhalten erstellt werden.
-
Suchanfrage
Die Zeichenfolge, für die eine Volltextsuche ausgeführt wird, um die Listenelemente zu generieren -
Suche in
Wo die Suche ausgeführt werden soll- Wählen Sie im Dialogfeld „Auswahl“ den Speicherort in AEM aus
- Aktuelle Seite verwenden, wenn leer
Tags tags
Die Liste kann mithilfe von Seiten erstellt werden, die bestimmten Tags unter einem bestimmten Ort entsprechen.
-
Übergeordnete Seite
Wo die Tag-Übereinstimmung beginnen sollte- Wählen Sie im Dialogfeld „Auswahl“ den Speicherort in AEM aus
- Aktuelle Seite verwenden, wenn leer
-
Tags
Welche Tags sollten abgeglichen werden- Verwenden Sie das Dialogfeld Durchsuchen, um die Tags auszuwählen.
-
Übereinstimmung
Definieren, welche Art von Übereinstimmung eine Seite qualifizieren soll, damit sie in die Liste aufgenommen wird- beliebiges Tag
- alle Tags
Sortieroptionen sort-options
Unabhängig davon, wie Sie die Liste erstellen, gibt es bestimmte Sortieroptionen, die immer definiert werden können.
-
Sortieren nach
Anordnung der Elemente- Titel
- Datum der letzten Änderung
-
Sortierreihenfolge
Die Reihenfolge, in der die Elemente angeordnet werden sollen- Aufsteigend
- Absteigend
-
Maximale Elemente
Maximale Anzahl der in der Liste angezeigten Elemente.- Leer lassen, um alle Elemente zurückzugeben.
-
ID - Diese Option dient zur Kontrolle der eindeutigen Kennung der Komponente in der HTML-Datei und auf der Datenschicht.
- Wenn Sie das Feld leer lassen, wird automatisch eine eindeutige ID generiert, die Sie über die resultierende Seite finden.
- Sofern eine ID angegeben wird, ist vom Autor bzw. der Autorin sicherzustellen, dass diese eindeutig ist.
- Änderungen der ID können sich auf das CSS-, JS- und Datenschicht-Tracking auswirken.
Registerkarte „Element-Einstellungen“ item-settings-tab
Auf der Registerkarte „Element-Einstellungen“ kann die Formatierung der Listenelemente konfiguriert werden.
- Elemente verknüpfen – Elemente mit der entsprechenden Seite verknüpfen
- Beschreibung anzeigen – Beschreibung des Link-Elements anzeigen
- Datum anzeigen – Änderungsdatum des Link-Elements anzeigen
- Als Teaser anzeigen – Wenn diese Option aktiviert ist, wird das Element als Teaser angezeigt
Registerkarte „Arten“ styles-tab-edit
Die Listenkomponente unterstützt das AEM-Stilsystem.
Verwenden Sie das Dropdown-Menü, um die Stile auszuwählen, die Sie auf die Komponente anwenden möchten. Die im Dialogfeld „Bearbeiten“ vorgenommenen Auswahlen haben denselben Effekt wie die in der Komponenten-Symbolleiste ausgewählten.
Stile müssen für diese Komponente im Dialogfeld „Design“ konfiguriert werden, damit das Dropdown-Menü verfügbar ist.
Dialogfeld „Design“ design-dialog
Über das Dialogfeld „Design“ kann der Vorlagenautor festlegen, welche Listentypen für Inhaltsautoren erlaubt und welche Elementeinstellungen verfügbar sind.
Listen-Einstellungen list-settings
Auf der Registerkarte Listen-Einstellungen kann das Datumsformat sowie der Listentyp definiert werden, der in der Komponente den Inhaltsautoren zur Verfügung stehen soll.
- Datumsformat
Format für die Anzeige des letzten Änderungsdatums - Untergeordnete Elemente deaktivieren
Deaktiviert den Listentyp „untergeordnete Elemente“ in der Komponente - Statische Anzeige deaktivieren
Deaktiviert den Listentyp „Statisch“ in der Komponente - Suche deaktivieren
Deaktiviert den Listentyp „Suche“ in der Komponente - Tags deaktivieren
Deaktiviert den Listentyp „Tags“ in der Komponente
Elementeinstellungen item-settings
Auf der Registerkarte Element-Einstellungen können die Formatierungsoptionen für die einzelnen Listenelemente definiert werden, die in der Komponente für die Inhaltsautoren verfügbar sein sollten.
- Elemente verknüpfen
Aktiviert die Option „Elemente verknüpfen“ im Dialogfeld „Bearbeiten“ - Beschreibungen anzeigen
Aktiviert die Option „Beschreibungen anzeigen“ im Dialogfeld „Bearbeiten“ - Datum anzeigen
Aktiviert die Option „Datum anzeigen“ im Dialogfeld „Bearbeiten“
Registerkarte „Arten“ styles-tab
Die Bildkomponente unterstützt das AEM-Stilsystem.
Adobe Client-Datenschicht data-layer
Die Listenkomponente unterstützt die Adobe Client-Datenschicht.