好用的语法

Hexo支持一些非markdown语法,例如标签外挂来实现特殊的功能–例如这个句子就是利用了标签外挂的Note (Bootstrap Callout)

以下是依照笔者喜好记录的一些好用的标签外挂

Note (Bootstrap Callout)

标准格式:

1
2
3
{% note [class] [no-icon] [style] %}
Any content (support inline tags too.io).
{% endnote %}

笔者喜欢flat风格+默认icon,遂可以简化为

1
2
3
{% note [class] %}
Any content (support inline tags too.io).
{% endnote %}

其中各种class效果展示如下

不填class长这样

defalut长这样

primary长这样

info长这样

warning长这样

danger长这样

个人认为这个适用范围很广 类似于传统markdown中的##加上====做了整合加上了icon修饰

Tabs

标准格式:

1
2
3
4
5
6
7
8
9
{% tabs Unique name, [index] %}

<!-- tab [Tab caption] [@icon] -->

Any content (support inline tags too).

<!-- endtab -->

{% endtabs %}

这个功能相当于在一个post中可以并行几个选项卡,对于笔者来说暂时没有什么使用场景,遂一切从简,以下是一个简化模板

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
{% tabs 选项卡名字 %}

<!-- tab 第一个tab的名字-->

**这是第一个tab**

<!-- endtab -->

<!-- tab 第二个tab的名字-->

**这是第二个tab**

<!-- endtab -->

<!-- tab 第三个tab的名字-->

**这是第二个tab**

<!-- endtab -->

{% endtabs %}

效果如下:

这是第一个tab

这是第二个tab

这是第三个tab

根据官方文档,每个tab的名字可以加上icon,此外也可以统一命名然后用数字索引,这里不做赘述

Timeline

标准格式:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
{% timeline title,color %}

<!-- timeline title -->

xxxxx

<!-- endtimeline -->
<!-- timeline title -->

xxxxx

<!-- endtimeline -->

{% endtimeline %}

因为笔者有分享自己成长经历的需求,所以timeline这个功能也很好^^,这里根据需要填入时间并选择颜色即可,由于笔者很喜欢default的蓝色,所以直接忽略了选颜色的参数,效果如下:

2025

05-03

今天我搭起来了我的博客

05-04

今天我写了第一个博客分享Post

参考