Summary: diagrams and visualizations for PmWiki
Version: 2021-12-06
Prerequisites: pmwiki-2.2+, PHP 5.2+ and a recent browser
Status: Beta
Maintainer: Dfaure
License: MIT
Download: mermaidjs.phpΔ
Users: (view? / edit)
Discussion: MermaidJs-Talk?


The recipe let you take advantage of the Mermaid.js scripting into PmWiki, allowing you to embed diagrams and charts into your pages.


  1. Put the recipe php fileΔ in the cookbook/ directory.
  2. And enable the recipe in your Local Customizations by setting the configuration according to your needs and including the recipe script.

Since Mermaid.js is a fairly large set of javascript, you can access it through a content delivery network or choose to download and install it locally and define the $MermaidScriptUrl variable accordingly.

...using a CDN

$MermaidScriptUrl = ""; # recipe's default configuration

This solution is ensuring you to always get the last stable version of the tool, with the requirement of an internet access available for the user.


A Mermaid.js sources archive may be downloaded from You would then need to:

  1. Extract it somewhere and copy/move the dist/ folder into a subfolder of the PmWiki's pub/ directory tree.
  2. Define $MermaidScriptUrl variable:
$MermaidScriptUrl = "\$FarmPubDirUrl/<YOUR_MERMAID_DIST_FOLDER>/mermaid.min.js";


The recipe is simply providing two markup definitions to enclose blocks of Mermaid.js own markup, such as:

... <mermaid_markup_here> ...


(:mermaid:) [@
 ... <mermaid_markup_here> ...

You may refer to the official documentation site for the Mermaid.js syntax.

Change log / Release notes

  • 2021-12-08 Initial release

If the recipe has multiple releases, then release notes can be placed here. Note that it's often easier for people to work with "release dates" instead of "version numbers".


Recipe written by Dfaure


See discussion at MermaidJs-Talk?

User notes? : If you use, used or reviewed this recipe, you can add your name. These statistics appear in the Cookbook listings and will help newcomers browsing through the wiki.