diff --git a/content/markdown-syntax.md b/content/markdown-syntax.md
index 10e8d82..7939130 100644
--- a/content/markdown-syntax.md
+++ b/content/markdown-syntax.md
@@ -134,17 +134,48 @@ Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and ot
 ## Mermaid
 
 {% mermaid() %}
+
+graph TD;
+A-->B;
+A-->C;
+B-->D;
+C-->D;
+
+{% end %}
+
+{% mermaid() %}
+
+```
 sequenceDiagram
-participant Alice
-participant Bob
-Alice->>John: Hello John, how are you?
-loop Healthcheck
-John->>John: Fight against hypochondria
-end
-Note right of John: Rational thoughts <br/>prevail!
-John-->>Alice: Great!
-John->>Bob: How about you?
-Bob-->>John: Jolly good!
+    participant Alice
+    participant Bob
+    Alice->>John: Hello John, how are you?
+    loop Healthcheck
+        John->>John: Fight against hypochondria
+    end
+    Note right of John: Rational thoughts <br/>prevail!
+    John-->>Alice: Great!
+    John->>Bob: How about you?
+    Bob-->>John: Jolly good!
+```
+
+{% end %}
+
+{% mermaid() %}
+
+```mermaid
+gitGraph
+       commit
+       commit
+       branch develop
+       commit
+       commit
+       commit
+       checkout main
+       commit
+       commit
+```
+
 {% end %}
 
 ## Admonition
diff --git a/templates/shortcodes/mermaid.html b/templates/shortcodes/mermaid.html
index 79b7a2f..d53ecc6 100644
--- a/templates/shortcodes/mermaid.html
+++ b/templates/shortcodes/mermaid.html
@@ -1,3 +1,3 @@
 <pre class="mermaid bg-white">
-  {{ body }}
+  {{ body | trim_start_matches(pat="```mermaid") | trim_start_matches(pat="```") | trim_end_matches(pat="```") }}
 </pre>