AnQiCMS作为一个功能强大的内容管理系统，在内容创作和展示方面提供了极大的灵活性。对于习惯使用Markdown语法进行写作的用户来说，AnQiCMS同样提供了便捷的支持，让内容创作者能够专注于文字本身，而无需过多关注排版细节。从2.1.1版本起，AnQiCMS便深度集成了Markdown编辑器的支持，使得文档内容的Markdown格式化和网页渲染变得轻而易举。
要实现AnQiCMS文档内容的自动Markdown转换并在网页中正确渲染，主要涉及到两个层面：首先是在后台启用Markdown编辑功能，确保内容以Markdown格式录入；其次是在前端模板中，通过特定的标签和辅助代码，将这些Markdown内容解析并美观地展示出来。
一、后台启用Markdown编辑器
首先，要确保系统已经开启了Markdown编辑功能。这如同为您的AnQiCMS内容创作流程配备了一把趁手的工具。操作步骤非常直观：
- 登录AnQiCMS后台：使用您的管理员账号进入系统管理界面。
- 导航至“全局设置”：在后台左侧菜单栏中，找到并点击“全局设置”选项。
- 选择“内容设置”：在“全局设置”的子菜单中，点击进入“内容设置”页面。
- 勾选并保存：在内容设置页面，您会看到一个名为“启用Markdown编辑器”的选项，请务必勾选它。勾选后，点击页面底部的“保存”按钮，让设置生效。
一旦启用，您在发布或编辑文档（如文章、产品、单页面、标签内容等）时，相应的内容输入框将支持Markdown语法输入。这意味着您可以直接使用# 标题、**加粗**、*斜体*、- 列表项等简洁的Markdown标记来组织您的内容。
二、前端模板中正确渲染Markdown内容
后台设置完成后，接下来就是在前端模板中，让这些Markdown内容能够被浏览器正确解析并美观地展示出来。这需要对AnQiCMS的模板标签和过滤器有基本的了解。
1. 基础内容渲染
AnQiCMS的模板系统非常灵活，它通过特定的标签和过滤器来处理内容。对于文档、分类、页面或标签的详情内容，通常会使用archiveDetail、categoryDetail、pageDetail或tagDetail等标签来获取。这些标签内部的Content字段承载着您的Markdown文本。
要让Markdown文本在网页上显示为HTML，我们需要在模板中对其进行处理。这里有两种常用方法：
- 使用
|render过滤器：在输出内容时，通过管道符|连接render过滤器。 - 在标签中添加
render=true参数：直接在内容详情标签内部设置render参数。
同时，为了确保解析后的HTML代码能够被浏览器正确渲染而不是作为纯文本显示，我们还需要配合使用|safe过滤器。|safe告诉模板引擎，这段内容是安全的HTML，无需进行自动转义。
以下是一个在文档详情页中渲染Markdown内容的示例：
{# 假设您正在文档详情页，archiveContent变量包含了Markdown内容 #}
{# 方法一：使用 |render 过滤器处理Markdown并用 |safe 避免转义 #}
<div class="markdown-body">
{% archiveDetail archiveContent with name="Content" %}{{ archiveContent|render|safe }}
</div>
{# 方法二：在标签内部直接指定render=true参数，同样需要 |safe 避免转义 #}
<div class="markdown-body">
{% archiveDetail articleContent with name="Content" render=true %}{{ articleContent|safe }}
</div>
请注意，|render或render=true是实现Markdown到HTML转换的关键。如果缺少这一步，即使内容是Markdown格式，前端也只会将其作为普通文本显示，而不会将其解析成带有格式的HTML。
2. 样式增强：美化Markdown排版
虽然内容被转换成了HTML，但原生的HTML元素通常样式朴素。为了让Markdown内容呈现出更好的视觉效果，例如代码块、列表、引用等的排版，我们需要引入一些CSS样式。AnQiCMS的官方文档推荐使用github-markdown-css，它能让您的Markdown内容看起来就像GitHub上的渲染效果一样，简洁而专业。
要引入这个样式表，您需要将以下代码添加到您的模板文件（通常是template/{您的模板目录}/base.html或主布局文件）的<head>标签内：
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.2.0/github-markdown.min.css" crossorigin="anonymous" referrerpolicy="no-referrer" />
引入CSS后，您可能还需要在包裹Markdown渲染内容的HTML元素上添加markdown-body类，以确保样式能够正确应用，例如：
<div class="markdown-body">
{# 这里是您的Markdown渲染内容，如 {{ archiveContent|render|safe }} #}
</div>
3. 特殊内容渲染：数学公式和流程图
Markdown本身可以表示数学公式和流程图，但浏览器无法直接识别并绘制它们。这需要借助特定的JavaScript库来解释和渲染。AnQiCMS的Markdown编辑器也支持这些特殊内容的输入，要使其在前端正常显示，您需要引入相应的第三方库。
数学公式的正确显示（MathJax）
对于数学公式，MathJax是一个非常流行且功能强大的JavaScript显示引擎。它能够将LaTeX、MathML等格式的数学表达式渲染成高质量的公式图片或SVG/HTML。
请将以下代码添加到您的
base.html或其他适当的模板文件的<head>标签关闭前：<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>流程图的正确显示（MermaidJS）
MermaidJS是一个基于JavaScript的图表绘制工具，它允许您使用简单的文本语法创建流程图、序列图、甘特图等。
请将以下代码添加到您的
base.html或其他适当的模板文件的<head>标签关闭前：”`html