Note (Bootstrap Callout)

1
2
3
{% note [class] [no-icon] [style] %} 
Any content (support inline tags too.io).
{% endnote %}
名称 用法
class 【可选】标识,不同的标识有不同的配色
(default / primary / success / info / warning / danger)
no-icon 【可选】不显示icon
style 【可选】可覆盖配置中的style
(simple/modern/flat/disabled)

default no-icon simple:

Any content (support inline tags too.io).

`primary no-icon modern`:

Any content (support inline tags too.io).

`success no-icon flat`:

Any content (support inline tags too.io).

`info no-icon disabled`:

Any content (support inline tags too.io).

1
2
3
{% note [color] [icon] [style] %} 
Any content (support inline tags too.io).
{% endnote %}
名称 用法
color 【可选】颜色
(default/blue/pink/red/purple/orange/green)
icon 【可选】可配置自定义icon(只支持fontawesome图标,也可配置no-icon)
style 【可选】可以覆盖配置中的style
(simple/modern/flat/disabled)

tag-hide

inline在文本里面添加按钮隐藏内容,只限文字
( content不能包含英文逗号,可用‚)

1
{% hideInline content,display,bg,color %}
  • content: 文本内容
  • display: 按钮显示的文字(可选)
  • bg: 按钮的背景颜色(可选)
  • color: 按钮文字的颜色(可选)

block独立的block隐藏内容,可以隐藏很多内容,包括图片,代码块等等

( display不能包含英文逗号,可用‚)

1
2
3
{% hideBlock display,bg,color %} 
content
{% endhideBlock %}
  • content: 文本内容
  • display: 按钮显示的文字(可选)
  • bg: 按钮的背景颜色(可选)
  • color: 按钮文字的颜色(可选)

如果你需要展示的内容太多,可以把它隐藏在收缩框里,需要时再把它展开。

( display不能包含英文逗号,可用‚)

1
2
3
{% hideToggle display,bg,color %} 
content
{% endhideToggle %}

Gallery相册图库

  • 相册集合

    1
    2
    3
    4
    5
    <div class="gallery-group-main"> 
    {% galleryGroup name description link img-url %}
    {% galleryGroup name description link img-url %}
    {% galleryGroup name description link img-url %}
    </div>
    • name:图库名字
    • description:图库描述
    • link:连接到对应相册的地址
    • img-url:图库封面的地址
  • Gallery相册

    1
    2
    3
    4
    5
    {% gallery %} 
    ![](url)
    ![](url)
    ![](url)
    {% endgallery %}

mermaid

mermaid标签不允许嵌套于一些隐藏属性的标签外挂,例如: tag-hide内的标签外挂和tabs标签外挂,这会导致mermaid图示无法正常显示

使用mermaid标签可以绘制Flowchart(流程图)、Sequence diagram(时序图)、Class Diagram(类别图)、State Diagram(状态图)、Gantt(甘特图)和Pie Chart(圆形图),具体可以查看mermaid文档

  • 打开mermaid标签需要修改 主题配置文件

    1
    2
    mermaid:  
    enable: true
  • 写法:

    1
    2
    3
    {% mermaid %}
    内容
    {% endmermaid %}
1
2
3
4
5
6
7
8
{% mermaid %}
pie
title Key elements in Product X
"Calcium" : 42.96
"Potassium" : 50.05
"Magnesium" : 10.01
"Iron" : 5
{% endmermaid %}

Button

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
{% btn [url],[text],[icon],[color] [style] [layout] [position] [size] %}

[url] :链接
[text] :按钮文字
[icon] : [可选]图标
[color] : [可选]按钮背景颜色(默认style时)
按钮字体和边框颜色(outline时)
default/blue/pink /red/purple/orange/green
[style] : [可选]按钮样式默认实心
outline/留空
[layout] : [可选]按钮布局默认为line
block/留空
[position] : [可选]按钮位置前提是设置了layout为block默认为左边
center/right/留空
[size] : [可选]按钮大小
larger/留空

tabs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
{% tabs Unique name, [index] %} 
<!-- tab [Tab caption] [@icon] -->
Any content (support inline tags too).
<!-- endtab -->
{% endtabs %}

Unique name : Unique name of tabs block tag without comma.
Will be used in #id's as prefix for each tab with their index numbers.
If there are whitespaces in name, for generate #id all whitespaces will replaced by dashes.
Only for current url of post/page must be unique!
[index] : Index number of active tab.
If not specified, first tab (1) will be selected.
If index is -1, no tab will be selected. It's will be something like spoiler.
Optional parameter.
[Tab caption] : Caption of current tab.
If not caption specified, unique name with tab index suffix will be used as caption of tab.
If not caption specified, but specified icon, caption will empty.
Optional parameter.
[@icon] : FontAwesome icon name (full-name, look like 'fas fa-font')
Can be specified with or without space; eg 'Tab caption @icon' similar to 'Tab caption@icon'.
Optional parameter.