jk / jekyll-mermaid-blog

A blog that uses jekyll and mermaid for diagrams

Jekyll-mermaid-blog

A Jekyll blog integrated with the mermaid library for diagrams and flowcharts in your posts and pages.

Installation

1. Install Jekyll
2. Download repository

Please see the Jekyll documentation for more installation options.

Config

The mermaid javascript files are sourced through _config.yml.

mermaid:
  src: '/js/mermaid.js'
  src_config: '/js/mermaid_config.js'

Publish the jekyll blog is done through the RakeFile so you will need to update the GITHUB_REPONAME.

Usage

Running the jekyll site locally by executing jekyll serve.

jekyll serve

The website can be published by executing a rake command.

rake publish

For working with mermaid diagrams, simply include the jekyll-mermaid block helper in any of your templates.

{% mermaid %}
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
{% endmermaid %}

Please see the mermaid documentation for more examples.

Demo

For a working example, check out the blog post as well the source code.