Is it possible to change the style of the TOC to something like this : http://getbootstrap.com/javascript/#dropdowns-events
Yes, that should be possible.
Ok… can you give me a pointer pls ?
with a shortcode ?
Hugo provides for each generated page a variable called TableOfContents that contains all informations you need. Take a look at the docs.
What is the structure of .TableOfContext ?
Is there a way I can step through the list of items or is it just a generated html string ?
The template of the output is currently hard-coded and the possible changes are somehow limited. There is already an issue on Github about this topic.
So far we’ve an approach to exclude some head levels via CSS. Otherwise you could need to modify the output with tools like jQuery.
I think someone can also use html instead of MarkDown formatting; the html headers (like <h2>) won’t be picked up while the MarkDown ones (##) are (if my memory serves me right). 