I have a shortcode that generates data from a JSON file. It has headings in the data and I even added a custom ID. Is there a way to make Hugo pick up these headings for the TOC?
It’s amazing the resources one can find by searching the forum. So I found this article. Method 3 throws an error about define and method 4 returns nil.
- Yes, but you need to use (and … understand the)
{{%shortcode delimiter. - Also see RenderShortcodes | Hugo – which can be very powerful, but you need to wrap your head around it and understand what it’s use case is (including markdown).
That one returns the code as html unprocessed. My code is creating content from a data file (tables, paragraphs, headings, etc), so only {{< works.
Does your shortcode produce Markdown or HTML?
I am the author of that article. I just tested all four methods again with v0.135.0. They all work great.
It produces HTML.
That’s not going to work. If you want to use Hugo’s built-in TableOfContents method, your shortcode needs to be something like this:
## Level 2 Markdown heading in shortcode
## Level 3 Markdown heading in shortcode
And you need to call it like this:
{{% markdown-headings %}}
The shortcode needs to follow the CommonMark specification regarding indentation and mixing HTML with Markdown (i.e., HTML Blocks).
I’ve written about this before, but you might consider using tocbot.js to render the TOC on the client side. It has none of the limitations described in this comparison table, and also includes HTML heading elements that appear outside of content (e.g., in a template file such as list.html).
I will try this.
This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.