diff --git a/exampleSite/content/docs/shortcodes/katex.md b/exampleSite/content/docs/shortcodes/katex.md
index 965577f..fae88c5 100644
--- a/exampleSite/content/docs/shortcodes/katex.md
+++ b/exampleSite/content/docs/shortcodes/katex.md
@@ -2,11 +2,11 @@
 
 KaTeX shortcode let you render math typesetting in markdown document. See [KaTeX](https://katex.org/)
 
-## Example 
+## Example
 {{< columns >}}
 
 ```latex
-{{</* katex [class="text-center"] */>}}
+{{</* katex [display] [class="text-center"]  */>}}
 x = \begin{cases}
    a &\text{if } b \\
    c &\text{if } d
@@ -25,3 +25,13 @@ x = \begin{cases}
 
 {{< /columns >}}
 
+## Display Mode Example
+
+Here is some inline example: {{< katex >}}\pi(x){{< /katex >}}, rendered in the same line. And below is `display` example, having `display: block`
+{{< katex display >}}
+x = \begin{cases}
+   a &\text{if } b \\
+   c &\text{if } d
+\end{cases}
+{{< /katex >}}
+Text continues here.
diff --git a/layouts/shortcodes/katex.html b/layouts/shortcodes/katex.html
index c3c36aa..ce7a6d9 100644
--- a/layouts/shortcodes/katex.html
+++ b/layouts/shortcodes/katex.html
@@ -7,7 +7,8 @@
 {{ .Page.Scratch.Set "katex" true }}
 {{ end }}
 
-<p class="katex{{ with .Get "class" }} {{ . }}{{ end }}">
-  $$ {{- .Inner -}} $$
-</p>
-
+<span class="katex{{ with .Get "class" }} {{ . }}{{ end }}">
+  {{ if in .Params "display" }}\[{{ else }}\({{ end -}}
+  {{ $.Inner }}
+  {{- if in .Params "display" }}\]{{ else }}\){{ end }}
+</span>