site

personal website, served at mordaunt.dev/site
Log | Files | Refs

mermaid-support.md (782B)


      1 +++
      2 authors = ["Lone Coder"]
      3 date = "2023-07-08"
      4 title = "Mermaid JS support"
      5 description = "The post demonstrates Mermaid JS support"
      6 tags = [
      7     "hugo",
      8     "markdown",
      9     "css",
     10     "html",
     11 ]
     12 categories = [
     13     "theme demo",
     14     "syntax",
     15 ]
     16 series = ["Theme Demo"]
     17 +++
     18 
     19 If you want to use [Mermaid-JS](https://mermaid-js.github.io/mermaid/#/) on your website.
     20 Provide `mermaid` as [Shortcode](https://gohugo.io/content-management/shortcodes/#readout) in your markdown file.
     21 
     22 {{<mermaid>}}
     23 flowchart LR
     24 
     25     A --> B
     26 
     27     B --> C
     28 
     29     C --> D
     30 
     31     D --> B
     32 
     33 {{</mermaid>}}
     34 
     35 {{<mermaid>}}
     36 sequenceDiagram
     37 participant Alice
     38 participant Bob
     39 Alice->>Bob: Hi Bob
     40 Bob->>Alice: Hi Alice
     41 {{</mermaid>}}
     42 
     43 Find more example on [Mermaid-JS](https://mermaid-js.github.io/mermaid/#/) website.