How to embed Mermaid diagrams in Gitit pages?

22 views
Skip to first unread message

capn....@gmail.com

unread,
Jun 25, 2023, 6:36:18 AM6/25/23
to gitit-discuss
Has anyone figured out how to embed Mermaid diagrams into their Gitit pages and have them rendered properly?

capn....@gmail.com

unread,
Jun 25, 2023, 10:39:34 AM6/25/23
to gitit-discuss
This worked:

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>

Reply all
Reply to author
Forward
0 new messages