Search code examples
htmlgithubgithub-flavored-markdown

How to make "spoiler" text in github wiki pages?


I'm trying to make text which is either invisible until moused over, or, has a "show" / "hide" button, or some other thing, so that it is not visible until the user interacts with it in some way.

I'm trying to do this on a github wiki page. (Specifically it's for a short self-quiz.)

Basically I want to get a similar effect to what SO achieves with the >! markup:

Hoho! Spoiler text!

as described in these meta posts.

The same markup doesn't work in github, I guess that it's an SO extension?

I saw this issue about using spoiler text in comments on github, which was closed, but I thought there might be a different answer for the wiki pages, or a different solution based on HTML or something?

Does anyone know if there's a way to do this, or if it is definitely unfortunately impossible?


Solution

  • Literal spoiler text as shown in the question is not supported in GitHub Flavored Markdown or the original Markdown implementation.

    However Markdown supports inline HTML, and GitHub allows a subset of HTML tags to remain in the rendered output. As described in other answers, <details> works on GitHub.

    If that's "spoilery" enough for you, feel free to use it.