Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Create TOC with multiple level

purushothamanv
Level 1
Level 1

how can I create table of content of a page which has H2, H3,, H4.

 

I want al heading level to appear in TOC.

1 Reply
BrianKasingli
Community Advisor
Community Advisor

There are many ways to implement your required, but here's what you can try. 

  1. Create a section-container component (sling:superResourceType parsys or responsive-grid).
  2. The section-container will allow dialogue configurations to include a title & title header level.
  3. The section-container allows content components be added in its content body.
  4. Create a TOC component;
  5. The TOC component with one to one relationship with a Sling Model.
  6. The TOC component will have logic to search for all section-container components configured on the page and display the title & title header level properties.
  7. Complete.

The page will only be constructed with the section-container component. While the TOC component sites on top of the section-container component.

JCR View:

/content/my-site/page/jcr:content/par/toccomponent
/content/my-site/page/jcr:content/par/sectioncontainercomponent0
/content/my-site/page/jcr:content/par/sectioncontainercomponent1
/content/my-site/page/jcr:content/par/sectioncontainercomponent2
/content/my-site/page/jcr:content/par/sectioncontainercomponent3