Tag Plugin 是一种使 Hexo 支持特殊样式内容的方法。例如,我们无法在标准 Markdown 中显示具有自定义尺寸的图像。然后我们可以使用标签插件来解决它。 Hexo 有很多可以帮助用户的标签。 Hexo 还具有主题接口,使主题能够创建自己的标签。
文本居中引用-Centered Quote
使用方法:
1 | {% cq %}世间所有的相遇,都是久别重逢{% endcq %} |
显示效果:
世间所有的相遇,都是久别重逢
提示块-Note
使用方法:
1 | {% note default %} |
主题配置文件中可以修改风格:
1 | # Note tag (bs-callout). |
显示效果:
default 提示块标签
primary 提示块标签
success 提示块标签
info 提示块标签
warning 提示块标签
danger 提示块标签
标签-Label
使用方法:
1 | {% label [email protected]默认 %} {% label [email protected]主要 %} {% label [email protected]成功 %} {% label [email protected]信息 %} {% label [email protected]警告 %} {% label [email protected]危险 %} |
显示效果:
默认 主要 成功 信息 警告 危险 这是成功的信息选项卡-Tabs
使用方法:
1 | {% tabs tab,1 %} 名字为tab,默认在第1个选项卡,如果是-1则隐藏 |
主题配置文件:
1 | # Tabs tag |
显示效果:
选项卡 1
选项卡 2
选项卡 3 名字为A
按钮-Button
使用方法:
1 | {% button url, text, icon [class], [title] %} |
url
: 绝对或相对URLtext
: 按钮文字,如果未指定图标则为必须icon
: FontAwesome图标名称(开头没有’fa-‘)。如果未指定文本,则为必需[class]
: FontAwesome类:fa-fw | fa-lg | fa-2x | fa-3x | fa-4x | fa-5X
,可选参数。[title]
: 鼠标悬停时的工具提示,可选参数。
注意:最好添加<div>
标签,测试时没加 div,下面显示不完全,加上非常美观。
一个示例:
1 | <div>{% button https://tding.top/ ,首页,home fa-fw,这是小丁的个人博客首页%}</div> |
显示效果:
多个按钮居中显示:
1 | <div class="text-center"><div>{% button https://tding.top/ ,首页,home fa-fw,这是小丁的个人博客首页%} {% button https://tding.top/movies/ ,观影,film fa-fw,豆瓣电影%} {% button https://tding.top/books/ ,阅读,book fa-fw,豆瓣读书%}</div></div> |