文章参考了Hugo博客添加mermaid作图

文章可以使用Mermaid添加流程图等，来增强信息传递效率和阅读体验，但PaperMod原生似乎并不支持（或者支持得不好？）Mermaid。

修改方法

1. 在项目目录layouts/shortcodes下添加mermaid.html，内容如下：

1
2
3

<div class="mermaid" align="center">
  {{.Inner}}
</div>

2. 复制主题目录themes/hugo-PaperMod/layouts/partials下的header.html到项目目录layouts/partials，然后在开头插入以下内容：

1
2
3

{{ if (.Params.mermaid) }}
<script async src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
{{ end }}

3. 在archetypes/default.md或者对应的模板头里添加以下内容：

1

mermaid: true

使用方法

把Markdown的语法标识替换为用{{}}包换的<mermaid>和</mermaid>标签（由于会直接被识别成shortcode进行解析，只能用语言描述），包括住实际的mermaid代码。