Creating a TOC from a slice zone headers

[Phil (Phil Snow)]

Hi Morten,

Welcome to the community!

I actually explain how to do that in Vue/Nuxt on this post here:

In-page Anchors

Hey @jerry.nummi, For your use case of the sub navigation. Something I do is use the HTMLSerializer to automatically add id's to my H2's from my rich texts. Like I do here: if (type === Elements.heading2) { var id = element.text.replace(/\W+/g, '-').toLowerCase(); return '<h2 id="' + id + '">' + children.join('') + '</h2>'; } Then I build a component that looks at the Slices on the current page, takes any H2 titles and creates a link to these. This example is in Vue, but you can e…

Let me know if you have any questions about this.

Thanks.