diff --git a/README.md b/README.md
index 50a9ee5..3b34422 100644
--- a/README.md
+++ b/README.md
@@ -193,6 +193,25 @@ pygmentsUseClasses = true
 
 ```
 
+## Support collapsible block
+
+You can create a collapsible block like this:
+
+```
+{{<details "summary title">}}
+
+block content
+
+{{</details>}}
+```
+
+And it will show like this:
+
+<details>
+  <summary>summary title</summary>
+  <p>block content</p>
+</details>
+
 ## deploy.sh example
 
 There are various way to deploy to github, here is a link to official [document](https://gohugo.io/hosting-and-deployment/hosting-on-github/).
diff --git a/layouts/shortcodes/details.html b/layouts/shortcodes/details.html
new file mode 100644
index 0000000..a1d9567
--- /dev/null
+++ b/layouts/shortcodes/details.html
@@ -0,0 +1,6 @@
+<details>
+  <summary>{{ (.Get 0) | markdownify }}</summary>
+  <p></p>
+  {{ .Inner | markdownify }}
+  <p></p>
+</details>