Syutoi
Step.4 主题特殊功能
文章目录
历史文档：本页保留上游主题的说明与示例，部分私有语法现仅显示为原文，不代表当前功能。当前写法与替代方案请参阅 Syutoi 写作与迁移示例。
:::primary :rocket:快速开始 - :love_letter:依赖插件 - :pushpin:基本配置 - :rainbow:界面显示 - :unicorn:特殊功能 :::
:::info
以下介绍可以使用的markdown或者标签代码。
功能大部分基于hexo-renderer-multi-markdown-it渲染器，尤其是代码块的显示，与默认渲染器不兼容。
:::
links 链接块
本功能参考NexT，基于Hexo Tag功能，用来建立友链或其他网址链接功能。
文章中的使用格式：
- 使用
links标签块，包围yml语法书写的内容，字段包括
--|--|--
site|站点名称|必填
owner|管理员名字|可选，默认为site的值
url|站点链接|必填
desc|站点描述|可选，默认为url的值
image|站点图片|可选，默认为images/404.png
color|方块颜色|可选，默认为#666
{% links %} |
举个栗子：
{% links %} |
- 以上标签块里的内容，还可以保存到一个
yml文件中，然后使用linksfile标签。 其中，path位于<root>/source目录下。
{% linksfile [path] %} |
举个栗子：
{% linksfile friends/_data.yml %} |
code代码块
使用markdown-it-prism进行代码高亮，支持显示行号、行高亮mark、命令行提示符command、代码块标题。
基本格式：[language] [title] [url] [link text] [mark] [command]
| 选项 | 描述 | 默认值 |
|---|---|---|
| language | - 支持的语言戳此 | null \ |
- 如果不需要代码高亮，但希望显示代码块样式，则设为raw |
\ | |
- 留空或设为info，将不显示代码高亮和代码块样式 |
||
| title | 代码块的标题文字 | null |
| url | 代码块标题右侧显示的链接 | null |
| link text | 上述链接显示的标题 | link |
| mark | 行高亮显示，格式为mark:行号,行号开始-行号结束,其他行号。 |
null \ |
例如mark:1,4-7,10，将高亮显示第1、4、5、6、7、10行 |
||
| command | 命令行提示符，格式为`command:("提示内容":行号,行号 | |
| 例如`command:("[root@localhost] $":1,9-10 |
```java 行高亮 https://shoka.lostyu.me 参考链接 mark:1,6-7 |
import java.util.Scanner; |
pwd |
quiz 练习题与答案
这个功能是用来显示练习题的。
需要在Front Matter中添加quiz: true，以正确显示题型标签。
--- |
点击选项可以显示答案，以及答案解析。
-
下列叙述正确的是 []{.gap} 。 {.quiz}
- 虚函数只能定义成无参函数
- 虚函数不能有返回值
- 能定义虚构造函数
- A、B、C都不对 {.correct} {.options}
-
有基类
SHAPE，派生类CIRCLE，声明如下变量： {.quiz .multi}SHAPE shape1,*p1;
CIRCLE circle1,*q1;下列哪些项是“派生类对象替换基类对象”。
p1=&circle1;{.correct}q1=&shape1;shape1=circle1;{.correct}circle1=shape1;{.options}
- :heavy_check_mark: 令基类对象的指针指向派生类对象
- :x: 派生类指针指向基类的引用
- :heavy_check_mark: 派生类对象给基类对象赋值
- :x: 基类对象给派生类对象赋值 {.options}
-
编译时多态主要指运算符重载与函数重载，而运行时多态主要指虚函数。 {.quiz .true}
-
如果定义
int e=8; double f=6.4, g=8.9;，则表达式f+int(e/3*int(f+g)/2)%4的值为 [9.4]{.gap}。 {.quiz .fill}注意运算顺序和数据类型 [8.4]{.mistake}
使用说明
本功能基于markdown-it-bracketed-spans和markdown-it-attrs
| 标签 | 含义 |
|---|---|
{.quiz} |
选择题 |
{.quiz .multi} |
多选题 |
{.quiz .true} |
正确的判断题 |
{.quiz .false} |
错误的判断题 |
{.quiz .fill} |
填空题 |
[]{.gap} |
空白下划线 |
[答案内容]{.gap} |
答案内容带下划线 |
{.options} |
ABCDE选项 |
{.correct} |
选择题的正确选项 |
> |
答案解析 |
[8.4]{.mistake} |
错题备注 |
emoji 绘文字
本功能基于markdown-it-emoji，所有标签参考戳此
:kissing_heart: |
:kissing_heart: :ring: :notes:
effects 文字特效
本功能基于markdown-it-ins、 markdown-it-bracketed-spans和markdown-it-attrs
本主题风格颜色通用样式：default、primary、success、info、warning、danger
++下划线++ |
:::warning
这段代码因为自动被pangu.js处理了一下，加了几个空格，导致直接复制代码不能正常显示。
正确的代码是++下划线++ ~~删除线~~ ==荧光高亮==，不能有空格哦。
:::
++下划线++
++波浪线++{.wavy}
++着重点++{.dot}
++紫色下划线++{.primary}
++绿色波浪线++{.wavy .success}
++黄色着重点++{.dot .warning}
删除线
红色删除线{.danger}
==荧光高亮==
[赤橙黄绿青蓝紫]{.rainbow}
[红色]{.red}
[粉色]{.pink}
[橙色]{.orange}
[黄色]{.yellow}
[绿色]{.green}
[靛青]{.aqua}
[蓝色]{.blue}
[紫色]{.purple}
[灰色]{.grey}
快捷键 [Ctrl]{.kbd} + [C]{.kbd .red}
H~2~0
29^th^
spoiler隐藏文字
本功能基于markdown-it-spoiler和markdown-it-attrs
!!黑幕黑幕黑幕黑幕黑幕黑幕!! ： 鼠标滑过显示内容 |
!!黑幕黑幕黑幕黑幕黑幕黑幕!! ： 鼠标滑过显示内容 !!模糊模糊模糊模糊模糊模糊!!{.bulr} ： 选中文字显示内容
label 标签块
本功能基于markdown-it-bracketed-spans和markdown-it-attrs
有以下颜色可选
[default]{.label} |
[default]{.label} [primary]{.label .primary} [info]{.label .info} [:heavy_check_mark:success]{.label .success} [warning]{.label .warning} [:broken_heart:danger]{.label .danger}
note 提醒块
本功能基于markdown-it-container
标签为：
--|--
开始行|:::[风格颜色]
结束行|:::
:::default |
:::default 默认默认 :::
:::primary 基本基本 :::
:::info 提示提示 :::
:::success 成功成功 :::
:::warning 警告警告 :::
:::danger 危险危险 :::
:::danger no-icon 没有图标 :::
tab标签卡
本功能基于markdown-it-container
标签为：
--|--
开始行|;;;[同一ID] [标签名称]
结束行|;;;
;;;id1 卡片1 |
;;;id1 卡片1 这里是卡片1的内容 加粗 [success]{.label .success}
;;;
;;;id1 卡片2 这里是卡片2的内容 :::danger 危险危险 :::
- 第一行
- 第二行 ;;;
;;;id2 ②号标签卡片1 这里是卡片1的内容 ;;;
;;;id2 ②号标签卡片2 这里是卡片2的内容 ;;;
collapse 折叠块
本功能基于markdown-it-container
标签为：
--|--
开始行|+++[风格颜色] [标题文字]
结束行|+++
+++ 默认默认 这里是一段文字 |
+++ 默认默认 这里是一段文字 ++下划线++ +++
+++primary 紫色 :::info 参考信息 :::
- 第一行
- 第二行 +++
+++info 蓝色 ;;;id3 卡片1 这里是卡片1的内容 ++波浪线++{.wavy} ;;;
;;;id3 卡片2 这里是卡片2的内容 ;;; +++
+++success 绿色
+++
+++warning 黄色 !!警告警告警告警告警告!!{.bulr} [label]{.label .success} +++
+++danger 红色 [danger]{.label .danger} +++
taskList 待办事项
本功能基于markdown-it-task-checkbox。
可以利用markdown-it-attrs添加风格颜色，只可以给ul标签添加，需要新建两行。
- [ ] 这是一个小叉叉 |
- 这是一个小叉叉
- 这是一个红色勾勾
{.danger}
- 未完成
- 完成
{.primary}
- 未完成
- 默认颜色
furigana文字注音
原本用于日语汉字假名注音，但别的注音也可以。
为了兼容性，采用markdown-it-ruby的基本格式：{文字^注音}，并且为了兼容表格，将分隔符由|换成了^。
注音分隔基于furigana-markdown-it显示说明看这里
--|--
{取り返す^とりかえす}|{取り返す^とりかえす}
{可愛い犬^か+わい・い・いぬ}|{可愛い犬^か+わい・い・いぬ}
{可愛い犬^か・わい・いいぬ}|{可愛い犬^か・わい・いいぬ}
{アクセラレータ^accelerator} | {アクセラレータ^accelerator}
{accelerator^アクセラレータ} | {accelerator^アクセラレータ}
{食べる^たべる} | {食べる^たべる}
{食べる^=たべる} | {食べる^=たべる}
{あいうえお^*} | {あいうえお^*}
{あいうえお^*❤} | {あいうえお^*❤}
{常用账号^contact}|{常用账号^contact}
media多媒体
本功能基于Hexo Tag功能，使用media标签，目前可选择两种类型，即audio和video。
{% media audio %} |
标签包绕一段yml格式的内容，格式与背景音乐的配置类似。
亦可以直接使用网易云、虾米、QQ音乐的播放列表、单曲。
{% media audio %} |
- 列表1
- 列表2
math数学公式
本功能基于markdown-it-katex
在Front Matter中添加math: true以支持KaTex
--- |
行内公式：$\sqrt{3x-1}+(1+x)^2$
独立块显示： $$\begin{array}{c}
\nabla \times \vec{\mathbf{B}} -, \frac1c, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \
\nabla \times \vec{\mathbf{E}}, +, \frac1c, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \
\nabla \cdot \vec{\mathbf{B}} & = 0
\end{array}$$
mermaid流程图
本功能基于markdown-it-mermaid
在Front Matter中添加mermaid: true以支持Mermaid
--- |
graph LR |
sequenceDiagram |