Collapsible Menu in HTML5 - Markdown

obsidian
Hugo

Markdown doesn’t support collapsible menu. Hugo and Obsidian does! It is actually standard HTML5 element ¹:

<details>
 
<summary>Tips for collapsed sections</summary>
 
You can add text within a collapsed section.
 
You can add an image or a code block, too.
 
</details>

It is unfortunate that obsidian can’t render markdown inside details. It will be shown as plain text. So, to use proper details in hugo I do ²:

{{< details summary="See the details" >}}
This is a **bold** word.
{{< /details >}}

Footnotes

1. Organizing information with collapsed sections - GitHub Docs ↩

2. Details shortcode ↩