We are currently planning to migrate to a different platform for the forum. We will announce this fact both here and on Twitter, once we have settled on a solution.

How to use/Expected use of Mermaid.js integration in Beta?

I'm trying to figure out how to use the Mermaid.js integration. Is it just for exports, is there live chart preview somewhere?

I think it is a great feature, using Mermaid/graphviz, I just can't seem to find the magic word to start.

Thanks! I'm really loving Zettlr.



  • Mermaid can be added by wrapping it in a fenced codeblock with the keyword mermaid, currently there's only rendering in the editor. There is a Pandoc-plugin somewhere, which can filter these things, I think Google will do the job!

  • I have used the most basic code as possible (example from mermaid.js page) in a "Fenced Code Block" and I'm not seeing anything produced. Is there a process or setting that I need to trigger/update in order to kick off the rendering?

    Here is the code block:

    graph TD
        A[Client] --> B[Load Balancer]
        B --> C[Server01]
        B --> D[Server02]


    Extra ` from forum formatting code.

    Thank you for your quick response earlier.


  • I figured it out! I did not add any extra space below the code block. As soon as I added a new line, the chart rendered perfectly.

    I apologize for bothering you. I definitely should have done more exploration before reaching out.

    The addition of MermaidJS is an excellent feature, so thank you for that.


Sign In or Register to comment.