The Table of Contents Component creates a ToC based on the titles in your page content allowing your readers to quickly navigate the page.
The Table of Contents component offers site visitors the ability to quickly navigate your page’s content through an efficiently-generated ToC based on the titles of the pages content.
The edit dialog allows the content author to define the range of titles to be used in the ToC. Using the design dialog, the template author can set the default value for the titles when a content author adds a Table of Contents Component to a page as well as restrict titles included in the ToC based on class names.
The current version of the Table of Contents Component is v1, which was introduced with release 2.20.0 of the Core Components in May 2022, and is described in this document.
The following table details all supported versions of the component, the AEM versions with which the versions of the component is compatible, and links to documentation for previous versions.
|Component Version||AEM 6.5||AEM as a Cloud Service|
For more information about Core Component versions and releases, see the document Core Components Versions.
To experience the Table of Contents Component as well as see examples of its configuration options as well as HTML and JSON output, visit the Component Library.
The latest technical documentation about the Table of Contents Component can be found on GitHub.
Further details about developing Core Components can be found in the Core Components developer documentation.
The edit dialog allows the content author to define the ranges of title levels that the Table of Contents Component should render as a ToC.
List Type - This option defines if the list should be a bulleted list or a numbered list.
Using the design dialog, the template author can set the default value for the title range of the Table of Contents Component as well as restrict titles included in the ToC based on class names.
The Table of Contents Component supports the AEM Style System.
The Table of Contents Component supports the Adobe Client Data Layer.