Collapsible markdown inside <details><summary>...</summary></details> fails to render

I used <details> and <summary> in a very vanilla GitHub Pages-enabled repo.

On GitHub, the markdown in the collapsible section is rendered correctly.

enter image description here

But on GitHub Pages, it is just a literal.

enter image description here

The issue is mentioned Markdown inside and not being processed, and the suggested fix is:

markdown: kramdown
kramdown:
  parse_block_html: true

That does indeed fix the rendering of the content, and I am fine with switching to kramdown, but it breaks the rendering of <details> and <summary> and the twirl-down. (So I rolled it back.)

See the page at https://deepchar.github.io/, the repo at https://github.com/deepchar/deepchar.github.io and the StackOverflow version of this issue at https://stackoverflow.com/questions/52944720/content-of-collapsible-sections-detailssummary-renders-markdown-in-gith.

1 Like

The question is now answered.  In short, add 

markdown: CommonMarkGhPages

 to _config.yml, which will render the site with CommonMark instead of kramdown.

5 Likes

Hi @bittlingmayer,

We are happy you are here! Thank you for sharing your solution. We’re looking forward to seeing you around!

Best,
Andrea

This is a really cool function. I’m going to implement it somehow. Thanks for the post!