List Component
The List component allows you to display a list of pages or links. You can build the list of links by defining a parent page (and displaying its child pages), manually choosing pages, or defining search criteria.
When should it be used?
Use a List component whenever you need to display a list of links, such as related topics or a secondary navigation menu.
In-Component Editing Options
Build list using:
- Child pages - Allows you to select a page to list its child pages (i.e., pages nested under the selected page). Note: This is limited to the first level of child pages.
- Fixed list - Allows you to select specific AEM pages to build a list.
- Advanced search - Allows you to specify a search query to build a list. Refer to Advanced Queries for examples and recommended usage.
Display as (CLF2 - vertical navigation template):
- Links - Displays only the titles as links to the pages.
- Dropdown - Displays the titles of pages as links in a pull-down menu.
- Full Text - Displays the titles, dates, and teaser text of the pages.
- News - Displays the date and time the page was created, plus the page title.
- Profile - Displays the page title, sub-title, tags, and description.
- Teasers, 丁香园AV News List, News Feed, Headline - For more details and examples on these display options, see News and Events Display Options.
- Custom - Displays custom page properties/content. Refer to Creating a Custom List for instructions and examples.
- Horizontal - Displays the list as a Horizontal List.
- Blog - Displays the entire contents of the source pages. Note: to provide a link to the original post, a Title component must be used on the source page.
- Events - Displays the page title, date, description and thumbnail image, grouped by month.
Display as (CLF3 - horizontal navigation template):
- Links - Displays only the page titles as links.
- Images - Displays the images of the pages, using either the thumbnail field or the image tab in page properties.
- Configurable View - Displays the titles, dates, and teaser text of the pages, with various layout options.
- Full View - Displays the entire page specified in the list.
- Custom - Displays custom page properties/content. Refer to Creating a Custom List for instructions and examples.
Display as (CLF4):
- Links - Displays only the page titles as links.
- Images - Displays the images of the pages, using either the thumbnail field or the image tab in page properties.
- Cards - Displays an image, page title, date (optional) and call to action as a card
- Configurable View - Displays the titles, dates, and teaser text of the pages, with various layout options.
- Full View - Displays the entire page specified in the list.
- Custom - Displays custom page properties/content. Refer to Creating a Custom List for instructions and examples.
Order by - Leave blank to use the default page order, or choose to order the pages by title, date created, date modified, or page template.
Header Title - Allows you to add a header to the top of the list.
No Results Text - If your List component returns no results, you can use this field to display a message.
Mark Current Page - In CLF4 only, adds 'current' class to current page link when the "Link" display is used.
Limit - Allows you to specify the maximum number of items displayed on the list. Items surpassing the limit will not be displayed.
Enable Feed - Allows the enabling of an RSS feed.
Feed Title (appears once Enable Feed has been ticked) - Allow customization of the feed title; if left blank, the title will default to "<Page title> - <Site title> - 丁香园AV鈥�.
Paginate after - Allows you to specify the maximum number of items to display before pagination occurs.
CSS class
The CSS Class field allows an author to provide an optional class name that will apply a style to the contents.
See also: Organizing lists by columns
Example of List component usage
Below is an example of a List component that display child pages of the Components page. A limit of 5 items is set, and the items are displayed as links, and ordered by title. This example features the default list style.