标签插件和 Front-matter 中的标签不同，它们是用于在文章中快速插入特定内容的插件。
虽然你可以使用任何格式书写你的文章，但是标签插件永远可用，且语法也都是一致的。
本文所用代码均来源于Butterfly主题的配置教程
Butterfly主题关于标签插件使用文章的源文件
摘录一些个人常用的标签插件格式，以便于写博客时快速使用。
Note (Bootstrap Callout)
用法1
{% 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） |
{% note simple %}
默认 提示块标籤
{% endnote %}
{% note default simple %}
default 提示块标籤
{% endnote %}
{% note primary simple %}
primary 提示块标籤
{% endnote %}
{% note success simple %}
success 提示块标籤
{% endnote %}
{% note info simple %}
info 提示块标籤
{% endnote %}
{% note warning simple %}
warning 提示块标籤
{% endnote %}
{% note danger simple %}
danger 提示块标籤
{% endnote %}
|
{% note modern %}
默认 提示块标籤
{% endnote %}
{% note default modern %}
default 提示块标籤
{% endnote %}
{% note primary modern %}
primary 提示块标籤
{% endnote %}
{% note success modern %}
success 提示块标籤
{% endnote %}
{% note info modern %}
info 提示块标籤
{% endnote %}
{% note warning modern %}
warning 提示块标籤
{% endnote %}
{% note danger modern %}
danger 提示块标籤
{% endnote %}
|
{% note flat %}
默认 提示块标籤
{% endnote %}
{% note default flat %}
default 提示块标籤
{% endnote %}
{% note primary flat %}
primary 提示块标籤
{% endnote %}
{% note success flat %}
success 提示块标籤
{% endnote %}
{% note info flat %}
info 提示块标籤
{% endnote %}
{% note warning flat %}
warning 提示块标籤
{% endnote %}
{% note danger flat %}
danger 提示块标籤
{% endnote %}
|
{% note disabled %}
默认 提示块标籤
{% endnote %}
{% note default disabled %}
default 提示块标籤
{% endnote %}
{% note primary disabled %}
primary 提示块标籤
{% endnote %}
{% note success disabled %}
success 提示块标籤
{% endnote %}
{% note info disabled %}
info 提示块标籤
{% endnote %}
{% note warning disabled %}
warning 提示块标籤
{% endnote %}
{% note danger disabled %}
danger 提示块标籤
{% endnote %}
|
{% note no-icon %}
默认 提示块标籤
{% endnote %}
{% note default no-icon %}
default 提示块标籤
{% endnote %}
{% note primary no-icon %}
primary 提示块标籤
{% endnote %}
{% note success no-icon %}
success 提示块标籤
{% endnote %}
{% note info no-icon %}
info 提示块标籤
{% endnote %}
{% note warning no-icon %}
warning 提示块标籤
{% endnote %}
{% note danger no-icon %}
danger 提示块标籤
{% endnote %}
|
用法 2（自定义 icon）
{% 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） |
{% note 'fab fa-cc-visa' simple %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note blue 'fas fa-bullhorn' simple %}
2021年快到了....
{% endnote %}
{% note pink 'fas fa-car-crash' simple %}
小心开车 安全至上
{% endnote %}
{% note red 'fas fa-fan' simple%}
这是三片呢？还是四片？
{% endnote %}
{% note orange 'fas fa-battery-half' simple %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note purple 'far fa-hand-scissors' simple %}
剪刀石头布
{% endnote %}
{% note green 'fab fa-internet-explorer' simple %}
前端最讨厌的浏览器
{% endnote %}
|
{% note 'fab fa-cc-visa' modern %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note blue 'fas fa-bullhorn' modern %}
2021年快到了....
{% endnote %}
{% note pink 'fas fa-car-crash' modern %}
小心开车 安全至上
{% endnote %}
{% note red 'fas fa-fan' modern%}
这是三片呢？还是四片？
{% endnote %}
{% note orange 'fas fa-battery-half' modern %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note purple 'far fa-hand-scissors' modern %}
剪刀石头布
{% endnote %}
{% note green 'fab fa-internet-explorer' modern %}
前端最讨厌的浏览器
{% endnote %}
|
{% note 'fab fa-cc-visa' flat %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note blue 'fas fa-bullhorn' flat %}
2021年快到了....
{% endnote %}
{% note pink 'fas fa-car-crash' flat %}
小心开车 安全至上
{% endnote %}
{% note red 'fas fa-fan' flat%}
这是三片呢？还是四片？
{% endnote %}
{% note orange 'fas fa-battery-half' flat %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note purple 'far fa-hand-scissors' flat %}
剪刀石头布
{% endnote %}
{% note green 'fab fa-internet-explorer' flat %}
前端最讨厌的浏览器
{% endnote %}
|
{% note 'fab fa-cc-visa' disabled %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note blue 'fas fa-bullhorn' disabled %}
2021年快到了....
{% endnote %}
{% note pink 'fas fa-car-crash' disabled %}
小心开车 安全至上
{% endnote %}
{% note red 'fas fa-fan' disabled %}
这是三片呢？还是四片？
{% endnote %}
{% note orange 'fas fa-battery-half' disabled %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note purple 'far fa-hand-scissors' disabled %}
剪刀石头布
{% endnote %}
{% note green 'fab fa-internet-explorer' disabled %}
前端最讨厌的浏览器
{% endnote %}
|
{% note no-icon %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note blue no-icon %}
2021年快到了....
{% endnote %}
{% note pink no-icon %}
小心开车 安全至上
{% endnote %}
{% note red no-icon %}
这是三片呢？还是四片？
{% endnote %}
{% note orange no-icon %}
你是刷 Visa 还是 UnionPay
{% endnote %}
{% note purple no-icon %}
剪刀石头布
{% endnote %}
{% note green no-icon %}
前端最讨厌的浏览器
{% endnote %}
|
label
高亮所需的文字
| 参数 |
解释 |
| text |
文字 |
| color |
【可选】背景颜色，默认为 default
default/blue/pink/red/purple/orange/green |
臣亮言：{% label 先帝 %}创业未半，而{% label 中道崩殂 blue %}。今天下三分，{% label 益州疲敝 pink %}，此诚{% label 危急存亡之秋 red %}也！然侍衞之臣，不懈于内；{% label 忠志之士 purple %}，忘身于外者，盖追先帝之殊遇，欲报之于陛下也。诚宜开张圣听，以光先帝遗德，恢弘志士之气；不宜妄自菲薄，引喻失义，以塞忠谏之路也。
宫中、府中，俱为一体；陟罚臧否，不宜异同。若有{% label 作奸 orange %}、{% label 犯科 green %}，及为忠善者，宜付有司，论其刑赏，以昭陛下平明之治；不宜偏私，使内外异法也。
|
臣亮言：先帝创业未半，而中道崩殂。今天下三分，益州疲敝，此诚危急存亡之秋也！然侍衞之臣，不懈于内；忠志之士，忘身于外者，盖追先帝之殊遇，欲报之于陛下也。诚宜开张圣听，以光先帝遗德，恢弘志士之气；不宜妄自菲薄，引喻失义，以塞忠谏之路也。
宫中、府中，俱为一体；陟罚臧否，不宜异同。若有作奸、犯科，及为忠善者，宜付有司，论其刑赏，以昭陛下平明之治；不宜偏私，使内外异法也。
wechat
