Volantis的标签插件有点多,为了方便书写的时候检索查询,并获得源代码。特提炼转载该参考文档。
V6 版本采用
::作为参数与内容的分隔符,部分标签使用空格分隔(如mark、hashtag)。[]表示可选参数。
文本符号
文本标记
带 下划线 的文本;带 删除线 的文本
键盘:⌘ + D 密码:
1 | {% u 下划线 %} {% emp 着重号 %} {% wavy 波浪线 %} {% del 删除线 %} |
mark文本背景色
高亮标记 自定义颜色1 | {% mark 高亮标记 %} |
hashtag标签
Hexo Volantis颜色可选:red, orange, yellow, green, cyan, blue, purple(不填则自动轮换)
1 | {% hashtag Hexo https://hexo.io %} |
文字颜色、段落渲染span
红色 黄色 绿色 青色 蓝色 灰色 GeoNotes 寓形宇内复几时,曷不委心任去留p 标签用法与 span 完全相同,区别是 p 渲染为独立段落。
| 属性 | 可选值 |
|---|---|
| 字体 | logo, code |
| 颜色 | red, yellow, green, cyan, blue, gray |
| 大小 | small, h4, h3, h2, h1, large, huge, ultra |
| 对齐 | left, center, right |
1 | {% span red::红色 %} {% span yellow::黄色 %} {% span green::绿色 %} |
备注note
可以在配置文件中设置默认样式,为简单的一句话提供最简便的写法。
note quote 适合引用一段话
note info 默认主题色,适合中性的信息
note warning 默认黄色,适合警告性的信息
note error/danger 默认红色,适合危险性的信息
note done/success 默认绿色,适合正确操作的信息
更多图标:
默认样式
可以加上颜色
说明还存在的一些故障
可以放置一些链接
放置一些附件链接
待办事项
彩色图标:
quote,info,warning,done/success,error/danger
灰色图标(可指定颜色):radiation,bug,idea,link,paperclip,todo,message,guide,download,up,undo
颜色:clear,light,gray,red,yellow,green,cyan,blue
1 | {% note::默认样式 %} |
彩色备注块Note
color 可设置 red、orange、amber、yellow、green、cyan、blue、purple、light、dark、warning、error 几种取值。 link
color 可设置 red、orange、amber、yellow、green、cyan、blue、purple、light、dark、warning、error 几种取值。 link
这是内容
1 | {% Note 一共支持12种颜色... color:blue [link](/) %} |
noteblock
小标题
Windows 10不是為所有人設計,而是為每個人設計
1 | {% noteblock quote::小标题 %} |
多选框 / 单选框
多选框checkbox
1 | {% Checkbox 普通的没有勾选的复选框 %} |
参数:
checked: true/false、color: red/orange/yellow/green/cyan/blue/purple、symbol: plus/minus/times
单选框radio
1 | {% Radio 没有勾选的单选框 %} |
参数:
checked: true/false、color: red/orange/yellow/green/cyan/blue/purple、symbol: plus/minus/times
quot引用
引用
引用内容
带图标的引用
带前缀后缀图标
参数:
el:h2/h3/p(元素标签)、icon:图标名、prefix:前缀图标、suffix:后缀图标
1 | {% quot 引用内容 %} |
段落引用
段落引用,这个是标准写法 > 引用内容 的增强版本,适合不太强调的、大段落的引用。
普通引用内容
这是使用 blockquote 标签的例子
1 | > 普通引用内容 |
时间线
不需要额外处理。
- 全局搜索
seotitle并替换为seo_title。 - group 组件的索引规则有变。
用
<!-- node 标题 -->注释标记每个时间节点,标题支持 Markdown 链接语法。
1 | {% Timeline %} |
链接、按钮、卡片
link
1 | {% link 链接标题::https://example.com::https://example.com/icon.png %} |
button
行内按钮 示例博客参数:
regular,large,center
1 | {% btn 行内按钮:: / %} |
ghcard
1 | {% ghcard 用户信息卡片::用户名 %} |
site
网站卡片可显示网站截图、logo、标题、描述,需在 _data/sites.yml 中配置数据,与友链数据可混用。
menu
1 | {% menu::下拉菜单示例 %} |
容器类
folding
查看图片测试
这里的内容会被折叠
默认打开的折叠框
这是一个默认打开的折叠框。
颜色:
blue,cyan,green,yellow,red。状态:open表示默认展开。支持嵌套。
1 | {% folding 查看内容 %} |
分栏标签tab
这是第一个标签页的内容
这是第二个标签页的内容
1 | {% tabs tab-id %} |
诗文poetry
最是那一低头的温柔,
像一朵水莲花不胜凉风的娇羞,
道一声珍重,道一声珍重,
那一声珍重里有蜜甜的忧愁——
沙扬娜拉!
1 | {% poetry 标题 author:作者 date:日期 footer:页脚 %} |
纸张paper
内部用 HTML 注释标记段落类型:
绝不像攀援的凌霄花,借你的高枝炫耀自己;
绝不学痴情的鸟儿,为绿荫重复单调的歌曲;
也不止像泉源,常年送来清凉的慰藉。
1 | {% paper style:underline title:标题 author:作者 date:日期 %} |
纵排诗歌reel
花间一壶酒,独酌无相亲。
举杯邀明月,对影成三人。
1 | {% reel 赏花 author:李白 date:唐 footer:全唐诗 %} |
目标管理
目标管理OKR(Objectives and Key Results)示例
可在OKR中嵌套其他组件
来自2088年末的复盘:已《基本》实现目标 ![]()
- 当 KR 进度为 100% 时,标签默认显示为 已完成
- 当 KR 未设置进度时,默认为 0%
- 当 O 未设置进度时,则显示所有 KR 进度平均值
您可以在 _config.yml 文件中修改标签的颜色和文案
您可以在 _config.yml 文件中增加任意的标签配置

1 | {% okr o1 %} |
多媒体
inlineimage
这是
一段话。
1 | 这是 {% inlineimage https://gcore.jsdelivr.net/gh/volantis-x/cdn-emoji/aru-l/0000.gif %} 一段话。 |
image
参数:width=300px, height=32px, alt=描述, bg=#f2f2f2
1 | {% image 链接 width=300px alt=描述 bg=#f2f2f2 %} |
gallery
参数:stretch(拉伸填充)、方向 left/center/right、列数 2~8、分组名
1 | {% gallery %} |
swiper
参数:width:min/max(宽度)、effect:cards/coverflow(切换效果)
1 | {% swiper effect:cards %} |
audio
1 | {% audio https://音频链接.mp3 %} |
video
videos::列数 支持 1~4 列网格布局
1 | {% video https://视频链接.mp4 %} |
frame
设备外框的图片/视频,目前仅支持 iphone11 设备边框。focus:top/bottom 控制截取上半或下半。
1 | {% Frame iphone11 img:图片链接 video:视频链接 focus:top %} |
交互类
copy
对于单行内容,可以使用 copy 标签来实现复制功能:
可以设置 git:https 或者 git:ssh 或者 git:gh 来快速放置一个 git 仓库链接:
1 | {% copy curl -s https://sh.xaox.cc/install | sh %} |
banner
见关于页面的示例
1 | {% banner 标题 副标题 bg:背景图 avatar:头像 link:跳转链接 %} |
表情 emoji
在emoji中搜索想要的表情图标。
1 | {% emoji blobcat attention %} {% emoji tieba huaji %} {% emoji aru-l 0190 %} |
如果对高度有特别要求,可以指定高度,例如:
盒子box
彩色代码块codeblock
设置 child:codeblock 并设置 color:颜色枚举 可以实现 10 种不同颜色的代码块,彩色代码块一般可以用在代码正确与错误的示范对比场景。
1 | import pandas as pd |
语法:
{% box child:codeblock color:颜色 %}` ... `{% endbox %},颜色可选 green/red/yellow/blue/cyan/purple 等。
嵌套多段代码块
将多个脚本嵌套在 box 标签内,每个脚本用不同的代码块表示。
1 | import pandas as pd |
1 | def kmo_test(data): |