new_site/_posts/2021-07-04-diagrams.md

35 lines
1.0 KiB
Markdown

---
layout: post
title: a post with diagrams
date: 2021-07-04 17:39:00
tags: formatting diagrams
description: an example of a blog post with diagrams
mermaid:
enabled: true
zoomable: true
---
This theme supports generating various diagrams from a text description using [mermaid](https://mermaid-js.github.io/mermaid/){:target="\_blank"}. Previously, this was done using the [jekyll-diagrams](https://github.com/zhustec/jekyll-diagrams){:target="\_blank"} plugin. For more information on this matter, see the [related issue](https://github.com/alshedivat/al-folio/issues/1609#issuecomment-1656995674). To disable the zooming feature, set `mermaid.zoomable` to `false` in this post frontmatter.
## Mermaid
The diagram below was generated by the following code:
````markdown
```mermaid
sequenceDiagram
participant John
participant Alice
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
```
````
```mermaid
sequenceDiagram
participant John
participant Alice
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
```