Listv3
List can be used to display a list of pages. They can be defined either dynamically - by search query, tags or from a parent page - or as a static list of items.
Examples
Built from Child Pages
List built from child pages of a root page. In this example the depth is 1 level but deeper structures can be configured.
- AEM Forms Container
- Title
- Text
- Image
- Button
- Teaser
- Download
- List
- Experience Fragment
- Content Fragment
- Content Fragment List
- Embed
- PDF Viewer
- Progress Bar
- Social Sharing
- Separator
- Properties
- Markup
- JSON
- showModificationDate: false
- linkItems: false
- parentPage: /content/core-components-examples/library/page-authoring
- sortOrder: asc
- showDescription: false
- sling:resourceType: core-components-examples/components/list
- childDepth: 1
- listFrom: children
-
AEM Forms Container
-
Title
-
Text
-
Image
-
Button
-
Teaser
-
Download
-
List
-
Experience Fragment
-
Content Fragment
-
Content Fragment List
-
Embed
-
PDF Viewer
-
Progress Bar
-
Social Sharing
-
Separator
Built from Fixed List
List built from a bespoke set of pages defined directly in the component edit dialog.
- Carousel
- Teaser
- Text
- Properties
- Markup
- JSON
- showModificationDate: false
- tagsMatch: any
- linkItems: false
- sortOrder: asc
- pages: /content/core-components-examples/library/container/carousel,/content/core-components-examples/library/page-authoring/teaser,/content/core-components-examples/library/page-authoring/text
- showDescription: false
- sling:resourceType: core-components-examples/components/list
- childDepth: 1
- listFrom: static
-
Carousel
-
Teaser
-
Text
Built from Search
List built from a search query term under a defined root page.
- Carousel
- Category Carousel
- Product Carousel
- Related Products
- Properties
- Markup
- JSON
- showModificationDate: false
- tagsMatch: any
- linkItems: false
- sortOrder: asc
- query: Carousel
- showDescription: false
- searchIn: /content/core-components-examples/library
- sling:resourceType: core-components-examples/components/list
- childDepth: 1
- listFrom: search
-
Carousel
-
Category Carousel
-
Product Carousel
-
Related Products
Built from Tags
List built from a set of tags to be found related to pages under a root page. Uses the default match Any tag feature, but it's also possible to configure the component to match all tags.
- Social Sharing
- Teaser
- Image
- Experience Fragment
- Text
- Separator
- List
- Download
- Content Fragment List
- Embed
- Content Fragment
- Button
- Properties
- Markup
- JSON
- showModificationDate: false
- tagsMatch: any
- linkItems: false
- sortOrder: asc
- tagsSearchRoot: /content/core-components-examples/library
- tags: core-components-examples:component-type/page-authoring
- showDescription: false
- sling:resourceType: core-components-examples/components/list
- childDepth: 1
- listFrom: tags
-
Social Sharing
-
Teaser
-
Image
-
Experience Fragment
-
Text
-
Separator
-
List
-
Download
-
Content Fragment List
-
Embed
-
Content Fragment
-
Button
Order
List built from child pages, with the sort order set to order by title, descending. It is also possible to order by the last modified date.
- Title
- Text
- Teaser
- Social Sharing
- Separator
- Progress Bar
- PDF Viewer
- List
- Image
- Experience Fragment
- Embed
- Download
- Content Fragment List
- Content Fragment
- Button
- AEM Forms Container
- Properties
- Markup
- JSON
- showModificationDate: false
- linkItems: false
- orderBy: title
- parentPage: /content/core-components-examples/library/page-authoring
- sortOrder: desc
- showDescription: false
- sling:resourceType: core-components-examples/components/list
- childDepth: 1
- listFrom: children
-
Title
-
Text
-
Teaser
-
Social Sharing
-
Separator
-
Progress Bar
-
PDF Viewer
-
List
-
Image
-
Experience Fragment
-
Embed
-
Download
-
Content Fragment List
-
Content Fragment
-
Button
-
AEM Forms Container
Max Items
List with the maximum number of items set to 4.
- AEM Forms Container
- Title
- Text
- Image
- Properties
- Markup
- JSON
- showModificationDate: false
- linkItems: false
- parentPage: /content/core-components-examples/library/page-authoring
- sortOrder: asc
- maxItems: 4
- showDescription: false
- sling:resourceType: core-components-examples/components/list
- childDepth: 1
- listFrom: children
-
AEM Forms Container
-
Title
-
Text
-
Image
Items with Link, Description and Date
The rendering of the list items can be configured to optionally display a link to the page, page description and last modified date.
- AEM Forms Container 2020-07-15 Display AEM Forms Container Component
- Title Display a page heading
- Text Display a rich text paragraph
- Image Display an image asset
- Button Display a button or anchor button
- Teaser Link an image and text
- Download Display an asset for download
- List Display a list of pages
- Experience Fragment Display an experience fragment
- Content Fragment Display a content fragment asset
- Content Fragment List Display a list of content fragments
- Embed Embed a third-party widget
- PDF Viewer Embed a PDF Viewer widget to display Document Cloud PDF's
- Progress Bar Display a progress indicator
- Social Sharing Add social sharing links
- Separator Display a section divider
- Properties
- Markup
- JSON
- showModificationDate: true
- linkItems: true
- parentPage: /content/core-components-examples/library/page-authoring
- sortOrder: asc
- showDescription: true
- sling:resourceType: core-components-examples/components/list
- childDepth: 1
- listFrom: children
-
AEM Forms Container
2020-07-15
Display AEM Forms Container Component
-
Title
Display a page heading
-
Text
Display a rich text paragraph
-
Image
Display an image asset
-
Button
Display a button or anchor button
-
Teaser
Link an image and text
-
Download
Display an asset for download
-
List
Display a list of pages
-
Experience Fragment
Display an experience fragment
-
Content Fragment
Display a content fragment asset
-
Content Fragment List
Display a list of content fragments
-
Embed
Embed a third-party widget
-
PDF Viewer
Embed a PDF Viewer widget to display Document Cloud PDF's
-
Progress Bar
Display a progress indicator
-
Social Sharing
Add social sharing links
-
Separator
Display a section divider
Items displayed as Teasers
The rendering of the list items can be configured to optionally display the items as teasers.
- Properties
- Markup
- JSON
- showModificationDate: true
- linkItems: true
- parentPage: /content/core-components-examples/library/page-authoring
- sortOrder: asc
- displayItemAsTeaser: true
- maxItems: 3
- showDescription: true
- sling:resourceType: core-components-examples/components/list
- childDepth: 1
- listFrom: children
-
-
-