butiran

Mermaid support

Add support for drawing flowchart with Mermaid .

shortcodes

Copy mermaid.html from themes\hugo-coder\layouts\shortcodes to layouts\shortcodes.

Copy baseof.html from themes\default\layouts\_default to layouts\_default.

Add following lines from Hugo Coder to baseof.html

  {{ if .HasShortcode "mermaid" }}
  
  
  {{ end }}

before </body>.

create post

Create new post

$ hugo new content posts/mermaid-support.md
Content "D:\\blank\\content\\posts\\mermaid-support.md" created

And edit it.

test mermaid

flowchart LR A --> B A(("1")) B(("2"))
{{< mermaid >}}
flowchart LR
  A --> B
  A(("1"))
  B(("2"))
{{< /mermaid >}}
flowchart TB A --> B A(("3")) B(("4"))
{{< mermaid >}}
flowchart TB
  A --> B
  A(("3"))
  B(("4"))
{{< /mermaid >}}
``