jgm / gitit

A wiki using HAppS, pandoc, and git
GNU General Public License v2.0
2.13k stars 225 forks source link

How to embed Mermaid diagrams in my pages? #686

Closed capn-freako closed 1 year ago

capn-freako commented 1 year ago

How can I embed a Mermaid diagram in my pages?

capn-freako commented 1 year ago

Aha! I got it. I had to make the following change to my local templates/pages.st file:

% diff -c ~/prj/gitit/data/templates/page.st ~/Documents/gitit/templates/page.st
*** /Users/dbanas/prj/gitit/data/templates/page.st  2022-12-23 11:41:20.000000000 -0500
--- /Users/dbanas/Documents/gitit/templates/page.st 2023-06-25 10:17:55.000000000 -0400
***************
*** 43,47 ****
--- 43,51 ----
      $javascripts$
      $expire()$
      $getuser()$
+     <script type="module">
+       import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';
+       mermaid.initialize({ startOnLoad: true });
+     </script>
    </body>
  </html>