You can get collapsible blocks in Github Markdown by using the <details></details>
and <summary></summary>
tags. For example,
<details>
<summary>Poe's Law (click to expand)</summary>
A humorous law of Internet forums, stating that "The best way to get the right answer on
the Internet is not to ask a question; it's to post the wrong answer."
</details>
renders as
Poe's Law (click to expand)
A humorous law of Internet forums, stating that "The best way to get the right answer on the Internet is not to ask a question; it's to post the wrong answer."In order to have non-collapsed sections by default, use <details open>
. Thus
<details open>
<summary>Poe's Law (click to close)</summary>
A humorous law of Internet forums, stating that "The best way to get the right answer on
the Internet is not to ask a question; it's to post the wrong answer."
</details>
renders as
Poe's Law (click to close)
A humorous law of Internet forums, stating that "The best way to get the right answer on the Internet is not to ask a question; it's to post the wrong answer."If you've a Markdown block, then you need an empty line after the tag. Otherwise the Markdown block won't render.
For example, the code block won't render here:
<details>
<summary>Encoding a string as UTF-8 in Raku</summary>
say "Hello!".encode('utf-8');
# OUTPUT: «utf8:0x<48 65 6C 6C 6F 21>»
</details>
Encoding a string as UTF-8 in Raku
say "Hello!".encode('utf-8'); # OUTPUT: «utf8:0x<48 65 6C 6C 6F 21>»but this does render:
<details>
<summary>Encoding a string as UTF-8 in Raku</summary>
say "Hello!".encode('utf-8');
# OUTPUT: «utf8:0x<48 65 6C 6C 6F 21>»
</details>
Encoding a string as UTF-8 in Raku
say "Hello!".encode('utf-8');
# OUTPUT: «utf8:0x<48 65 6C 6C 6F 21>»