Tag Plugin Plus 外挂标签全览

---

时间轴

时间轴

2026-07-11

init

本文介绍了当前主题对标准 Markdown 及扩展语法的渲染支持测试情况，并详细展示了从 Butterfly 移植到 Cactus 主题的 Tag Plugin Plus 外挂标签全览，包括链接卡片、行内文本标签、提示框、折叠框、时间线和标签页等组件的语法与渲染效果。

---

Markdown 基础语法

以下测试当前主题对标准 Markdown 及扩展语法的渲染支持情况。

---

标题层级

h1 一级标题

h2 二级标题

h3 三级标题

h4 四级标题

h5 五级标题

h6 六级标题

---

行内格式

粗体文本、斜体文本、粗斜体文本、删除线文本、行内代码

高亮文本（若支持）、上标 X²、下标 H₂O（若渲染器支持）

高亮 (mark) 边界

连续高亮：第一段 与 第二段 之间夹杂普通文字。

高亮内嵌格式：粗体 +代码+ 删除 混合行内语法。

引用块内的 高亮文字。

场景	示例
表格内高亮	单元格高亮
高亮含链接	even629

---

链接

普通链接

外部链接

带标题的链接

even629’s blog

参考式链接

Hexo 官网 和 Cactus 主题

自动链接

https://even629.com

---

图片

普通图片

头像

带标题的图片

头像

---

列表

无序列表

• 一级列表项 A
• 一级列表项 B
  • 二级嵌套项 B1
  • 二级嵌套项 B2
    • 三级嵌套项
• 一级列表项 C

有序列表

1. 第一步
2. 第二步
   1. 第二步的子步骤 A
   2. 第二步的子步骤 B
3. 第三步

任务列表

• 已完成任务
• 未完成任务
• 待办事项
  • 嵌套任务项

任务列表边界

• 阅读 Hexo 文档 并 记录笔记
• 运行hexo s本地预览
• 提交 草稿 正式版
• 普通列表项（与任务项混排）
  • 嵌套任务，含行内代码
  • 嵌套任务已完成

---

引用

单层引用

这是一段引用文字。可以跨越多行。

嵌套引用

第一层引用

第二层引用

第三层引用

引用内嵌其他元素

引用内的标题

• 列表项 1
• 列表项 2

console.log("hello")

继续嵌套

---

代码

行内代码

在文本中使用print()函数来输出内容。

围栏代码块

#include <stdio.h>

int main() {
    printf("Hello, World!\n");
    return 0;
}

代码块指定语言

def fibonacci(n):
    a, b = 0, 1
    for _ in range(n):
        yield a
        a, b = b, a + b

print(list(fibonacci(10)))

fn main() {
    let msg = "Hello, 世界!";
    println!("{}", msg);
}

代码块内的转义

<div class="container">
  <p>Hello &amp; welcome</p>
</div>

---

表格

基本表格

列 A	列 B	列 C
值 1	值 2	值 3
值 4	值 5	值 6

对齐表格

左对齐	居中对齐	右对齐
左	中	右
单元格	单元格	单元格

表格内嵌行内格式

名称	说明
粗体	粗体文本
代码	行内代码
链接	点我
混合	粗体 +代码+ 删除

---

分割线

---

---

---

---

脚注

这是一段有脚注的文字^[1]，这里还有另一个脚注^[2]。

---

Emoji

😆 🚀 ❤️ 👍 💯 🔥 💪 👏

---

转义字符

*不会变成斜体* `不会变成代码` ~不会变成删除线~

---

数学公式 (KaTeX)

行内公式

质能方程：$E = mc^2$

欧拉公式：$e^{i\pi} + 1 = 0$

块级公式

$$\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n$$

$$\int_{a}^{b} f(x)\,dx = F(b) - F(a)$$

$$\begin{bmatrix} 1 & 2 & 3 \\ 4 & 5 & 6 \\ 7 & 8 & 9 \end{bmatrix}$$

---

---

Tag Plugin Plus 外挂标签

以下展示所有从 Butterfly 移植到 Cactus 的外挂标签及其变体。

---

链接卡片 (link)

带图片的链接

even629's blog

https://even629.com

不带图片的链接

Hexo官网

https://hexo.io

语法：{% link 标题, 链接, 图片URL(可选) %}

---

链接卡片

Hexo

https://hexo.io

Cactus

https://github.com/probberechts/hexo-theme-cactus

Font Awesome

https://fontawesome.com

语法：{% link ... %}

---

行内图片 (inlineimage)

在一段文字中 嵌入行内小图标。

自定义高度：

语法：{% inlineimage 图片URL, height=高度(可选) %}

---

行内文本标签

样式一览

标签	效果	说明
u	下划线文字	下划线
emp	着重文字	着重标记
wavy	波浪线文字	波浪下划线
kbd	Ctrl + C	键盘按键
psw	密码文字	密码遮蔽（hover 可见）
del	删除文字	删除线

组合使用

按下 Ctrl + Shift + I 打开开发者工具。

这是一段包含下划线、着重和波浪线的混合文本。

语法：{% 标签名 文字内容 %}— 无结束标签

---

带颜色段落 (p) 与行内 (span)

颜色测试

红色段落文字

蓝色段落文字

绿色段落

黄色段落

青色段落

紫色段落

灰色段落

行内 span

这是一段文字，其中包含红色文字和蓝色文字。

对齐方式

居中段落文字

右对齐段落文字

字号大小

大号字体段落

超大号字体段落

语法：{% p 颜色, 文字 %}/{% span 颜色, 文字 %}— 颜色支持中英文（红/red、蓝/blue 等）

---

提示框 (tip)

基础样式

默认样式的 tip 提示框

info 样式的 tip

success 样式的 tip（成功提示）

warning 样式的 tip（警告提示）

danger 样式的 tip（危险提示）

扩展样式

bolt 样式（闪电图标）

ban 样式（禁止图标）

home 样式（主页图标）

sync 样式（同步图标）

cogs 样式（齿轮图标）

key 样式（钥匙图标）

bell 样式（铃铛图标）

语法：{% tip 样式名 %} 内容 {% endtip %}— 样式：info / success / warning / danger / bolt / ban / home / sync / cogs / key / bell

---

折叠框 (folding)

默认样式

点击展开查看详情

折叠框里的内容，支持 Markdown 语法。

• 列表项
• 行内代码

console.log("折叠框内的代码");

颜色变体

蓝色折叠

蓝色边框的折叠框

红色折叠

printf("红色折叠内的代码块\n");

绿色折叠

绿色折叠框内容

紫色折叠

紫色折叠框内容

青色折叠

青色折叠框内容

黄色折叠

黄色折叠框内容

橙色折叠

橙色折叠框内容

默认展开的折叠框

默认展开的绿色折叠框

这个折叠框默认是展开的（添加open关键字）。

折叠框内嵌表格

折叠框内的表格

名称	值
属性 A	100
属性 B	200

折叠框嵌套

外层折叠

外层内容

内层折叠

内层内容

语法：{% folding [颜色] [open], 标题 %} 内容 {% endfolding %}— 颜色（可选）：blue / red / green / purple / cyan / yellow / orange；添加open关键字可使折叠框默认展开

---

时间线 (timeline)

蓝色时间线

我的时间线

2024年

开始写博客，搭建 Hexo 站点。

2025年

迁移到 Cactus 主题，优化阅读体验。

2026年

完善外挂标签，增加英文翻译。

绿色时间线

项目进度

Q1

需求分析与设计

Q2

核心功能开发

Q3

测试与部署上线

其他颜色变体

红色时间线

节点一

红色时间线节点内容

节点二

含 粗体 与代码的节点

橙色时间线

橙色节点

橙色时间线节点内容

紫色时间线

紫色节点

紫色时间线节点内容

语法：{% timeline 标题, 颜色 %} 内容 {% endtimeline %}— 颜色：blue / green / red / orange / purple

---

标签页 (tabs)

基本标签页

CRustPython

C 是一种通用的过程式编程语言。

printf("hello\n");

Rust 是一种注重安全性的系统编程语言。

println!("hello");

Python 是一种简洁优雅的解释型语言。

print("hello")

指定默认激活标签

标签一标签二标签三（默认激活）

第一个标签的内容

第二个标签的内容

第三个标签的内容，页面加载时自动显示。

带图标的标签页

代码相关内容

设计相关内容

语法：{% tabs 标题, 默认激活序号 %} 内容 {% endtabs %}— 带图标：<!-- tab @fa-icon-class -->

---

多级标签页 (subtabs)

一级 A一级 B

这是第一层 tab A 的内容。

子 1子 2

子标签 1 的内容

子标签 2 的内容

第一层 tab B 的内容。

语法：在tab内部嵌套subtabs/subsubtabs（语法同tabs）

---

注解框 (note)

四种基础风格

flat 风格的 note（默认），适合普通提醒。

modern 风格 note，简洁的纯色背景。

simple 风格 note，左侧带颜色边框。

disabled 风格 note，灰色调。

带标题的 note

注意事项

请在使用前仔细阅读文档。

带图标的 note

提示

带灯泡图标的 note 提醒。

警告

带警告图标的 note。

Note 内嵌 Markdown

支持 粗体、斜体、代码等行内格式。

• 列表项
• 也可以有代码块

const msg = "hello";

标题 + 图标 + 样式组合

modern 现代风格带标题

标题、图标、样式三者同时存在的 modern note。

simple 简洁风格带标题

simple 风格 + 标题 + 灯泡图标。

disabled 已禁用带标题

disabled 风格 + 标题，无图标。

语法：{% note 标题(可选), 图标(可选) %} 内容 {% endnote %}— 风格通过 CSS 类控制

---

进度条 (progress)

基础颜色

90% 已完成

60% 进行中

30% 受阻

扩展颜色

info 进度

primary 进度

blue 进度

gray 进度

边界值

100% 全部完成

0% 尚未开始

语法：{% progress 宽度百分比, 颜色, 标签文字 %}— 颜色：success / warning / danger / info / primary / blue / gray

---

复选框 (checkbox)

默认状态

苹果

香蕉

草莓

选中状态

西瓜

葡萄

颜色变体

红色复选框

绿色复选框

蓝色复选框

黄色复选框

青色复选框

样式变体

加号样式

减号样式

叉号样式

单选框 (radio)

单选选项一

单选选项二

红色单选

颜色与样式叠加

红色加号

绿色减号

黄色叉号

青色单选

蓝色加号

语法：{% checkbox 文字, checked(可选) %}— 颜色/样式放在文字前：red/green/blue/yellow/cyan/plus/minus/times/radio

---

气泡注释 (bubble)

默认颜色

把鼠标移到这个词语 这是注释文字上查看注释。

自定义颜色

另一个词 另一种注释

连续气泡

一句话中可以有多个 第一个注释气泡 第二个注释依次排列。

语法：{% bubble 文字, 注释, 颜色(可选) %}— 无结束标签，hover 显示注释

---

引用标签 (referto + referfrom)

单个引用

正文中引用标注¹Hexo官方文档，点击数字跳转到文末参考文献。

1

Hexo 官方文档

多个引用

这是第2个引用²Cactus 主题 GitHub和第3个引用³Font Awesome 图标库。

第4个引用⁴超级长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长标题测试

2

Cactus 主题 GitHub

3

Font Awesome 图标库

4

超级长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长长标题测试

语法：{% referto '编号','文献名' %}文中标注 +{% referfrom '编号','文献名','URL' %}文末列表

鼠标悬停在编号上可预览文献名，点击跳转至文末对应条目。

---

1. 第一个脚注内容。 ↩︎

2. 第二个脚注，可以包含格式和代码。 ↩︎