Markdown 扩展语法

Create watermark for webpage and automatic adjust when window resize.

警告
本文最后更新于 2023-06-12,文中内容可能已过时。

[FixIt 主题提供了一些扩展的语法便于你撰写文章。

Emoji 支持

这部分内容在 Emoji 支持页面 中介绍。

数学公式

FixIt 基于 KaTeXKATEX 提供数学公式的支持。

在你的 主题配置 中的 [params.math] 下面设置属性 enable = true, 并在文章的前置参数中设置属性 math: true 来启用数学公式的自动渲染。

技巧
注意

由于 Hugo 在渲染 Markdown 文档时会根据 _/*/>> 之类的语法生成 HTML 文档, 并且有些转义字符形式的文本内容 (如 \(/\)/\[/\]/\\) 会自动进行转义处理, 因此需要对这些地方进行额外的转义字符表达来实现自动渲染:

  • _ -> \_
  • * -> \*
  • >> -> \>>
  • \( -> \\(
  • \) -> \\)
  • \[ -> \\[
  • \] -> \\]
  • \\ -> \\\\

FixIt 主题支持 raw shortcode 以避免这些转义字符, 它可以帮助您编写原始数学公式内容。

一个 raw 示例:

1
2
3
4
5
6
<div class="fi-row">行内公式:\(\mathbf{E}=\sum_{i} \mathbf{E}_{i}=\mathbf{E}_{1}+\mathbf{E}_{2}+\mathbf{E}_{3}+\cdots\)</div>

<div class="fi-row">
公式块:
\[ a=b+c \\ d+e=f \]
</div>

呈现的输出效果如下:

行内公式:\(\mathbf{E}=\sum_{i} \mathbf{E}_{i}=\mathbf{E}_{1}+\mathbf{E}_{2}+\mathbf{E}_{3}+\cdots\)
公式块: \[ a=b+c \\ d+e=f \]

行内公式

默认的行内公式分割符有:

  • $ ... $
  • \( ... \) (转义的: \\( ... \\))

例如:

1
$c = \pm\sqrt{a^2 + b^2}$\\(f(x)=\int_{-\infty}^{\infty} \hat{f}(\xi) e^{2 \pi i \xi x} d \xi\\)

呈现的输出效果如下:

$c = \pm\sqrt{a^2 + b^2}$ 和 \(f(x)=\int_{-\infty}^{\infty} \hat{f}(\xi) e^{2 \pi i \xi x} d \xi\)

公式块

默认的公式块分割符有:

  • $$ ... $$
  • \[ ... \] (转义的:\\[ ... \\])
  • \begin{equation} ... \end{equation} (不编号的:\begin{equation*} ... \end{equation*})
  • \begin{align} ... \end{align} (不编号的:\begin{align*} ... \end{align*})
  • \begin{alignat} ... \end{alignat} (不编号的:\begin{alignat*} ... \end{alignat*})
  • \begin{gather} ... \end{gather} (不编号的:\begin{gather*} ... \end{gather*})
  • \begin{CD} ... \end{CD}
警告
当公式块中存在换行时,请谨慎开启 goldmark.renderer.hardWraps,设置为 true,Goldmark 会将换行符呈现为 <br> 元素。

例如:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
$$ c = \pm\sqrt{a^2 + b^2} $$

\\[ f(x)=\int_{-\infty}^{\infty} \hat{f}(\xi) e^{2 \pi i \xi x} d \xi \\]

\begin{equation*}
  \rho \frac{\mathrm{D} \mathbf{v}}{\mathrm{D} t}=\nabla \cdot \mathbb{P}+\rho \mathbf{f}
\end{equation*}

\begin{equation}
  \mathbf{E}=\sum_{i} \mathbf{E}\_{i}=\mathbf{E}\_{1}+\mathbf{E}\_{2}+\mathbf{E}_{3}+\cdots
\end{equation}

\begin{align}
  a&=b+c \\\\
  d+e&=f
\end{align}

\begin{alignat}{2}
   10&x+&3&y = 2 \\\\
   3&x+&13&y = 4
\end{alignat}

\begin{gather}
   a=b \\\\
   e=b+c
\end{gather}

\begin{CD}
   A @>a\>> B \\\\
@VbVV @AAcA \\\\
   C @= D
\end{CD}

呈现的输出效果如下:

失败
​ 依据警告调整,暂未找到合适方法
技巧
你可以在 主题配置 中自定义行内公式和公式块的分割符。

Copy-tex

Copy-tex 是一个 KaTeXKATEX 的插件。

通过这个扩展,在选择并复制 KaTeXKATEX 渲染的公式时,会将其 LaTeXLATEX 源代码复制到剪贴板。

在你的 主题配置 中的 [params.math] 下面设置属性 copyTex = true 来启用 Copy-tex。

选择并复制上一节中渲染的公式,可以发现复制的内容为 LaTeX 源代码。

mhchem

mhchem 是一个 KaTeXKATEX 的插件。

通过这个扩展,你可以在文章中轻松编写漂亮的化学方程式。

在你的 主题配置 中的 [params.math] 下面设置属性 mhchem = true 来启用 mhchem。

给作者买杯卡布奇诺~
支付宝
微信
0%