banner
KowLoon

九龙博客 KowLoon Blog

九龙博客 KowLoon Blog-空零博客,一枚雲居民與技術以及羊毛教程分享博客
github
twitter
tg_channel
instagram
telegram
email
bilibili
netease cloud music artist

外掛標籤

{% note 'danger modern' %}

内置的外挂标签满足大部分用户的需求,不需要额外安装插件。
插件的外挂标签需要安装对应的插件,满足部分用户的特殊需求。

{% endnote %}

内置标签#

Article#

文章列表标签,用于显示文章列表。

{% tabs Article %}

{% article %}
参数说明默认值
path文章路径
{% article 'p/96204d3d.html' %}

{% article 'p/96204d3d.html' %}

{% endtabs %}

Chart#

图表标签,用于显示图表。
打开配置文件中开关

chart: true

{% tabs Chart %}

{% chart %}

不需要参数。

{% chart %}
{% endchart %}

{% chart %}
type: 'bar',
data: {
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
borderWidth: 1
}]
},
options: {
scales: {
y: {
beginAtZero: true,
}
}
}
{% endchart %}

{% endtabs %}

图片列表标签,用于显示图片列表。

{% tabs gallery %}

{% gallery %}
{% endgallery %}
{% gallery %}

![](https://s3.qjqq.cn/47/674c6e226855e.png!water)
![](https://s3.qjqq.cn/47/674c6e226855e.png!water)
![](https://s3.qjqq.cn/47/674c6e226855e.png!water)
![](https://s3.qjqq.cn/47/674c6e226855e.png!water)
![](https://s3.qjqq.cn/47/674c6e226855e.png!water)

{% endgallery %}

{% gallery %}
image
image
image
image
image
{% endgallery %}

{% endtabs %}

GalleryGroup#

图片组标签,用于显示图片组。

{% tabs GalleryGroup %}

{% galleryGroup 'name' 'desc' 'url' 'img' %}
参数说明默认值
name图片组名称
desc图片组描述
url图片组链接
img图片组预览图
<div class='gallery-group-main'>
{% galleryGroup '旅行' '出行拍摄的杂七杂八' 'https://hsbc.com.cv' 'https://s3.qjqq.cn/47/674c6e226855e.png!color' %}
{% galleryGroup '旅行' '出行拍摄的杂七杂八' 'https://hsbc.com.cv' 'https://s3.qjqq.cn/47/674c6e5d63fda.png!color' %}
</div>

{% endtabs %}

Mermaid#

Mermaid 标签,用于显示 Mermaid 图表。

mermaid: true

{% tabs Mermaid %}

{% mermaid %}
content
{% endmermaid %}
{% mermaid %}
pie
title Key elements in Product X
"Calcium" : 42.96
"Potassium" : 50.05
"Magnesium" : 10.01
"Iron" : 5
{% endmermaid %}

{% endtabs %}

Typeit#

Typeit 标签,用于显示 Typeit 动画。

typeit: true

{% tabs Typeit %}

{% typeit 'div' %}
options
{% endtypeit %}
参数说明默认值
div标签名
{% typeit 'div' }
waitUntilVisible: true,
strings: "Alex MacArthur",
{% endtypeit %}

{% typeit 'div' %}
waitUntilVisible: true,
strings: "Alex MacArthur"
{% endtypeit %}

{% endtabs %}

Tabs#

标签页标签,用于显示标签页。

{% tabs Tabs %}

{% tabs 唯一名称, [index] %}

<!-- tab [唯一Tab] [@icon] -->

任何内容(也支持内联标签)。

<!-- endtab -->

{% endtabs %}
{% tabs test1 %}

<!-- tab -->

**This is Tab 1.**

<!-- endtab -->

<!-- tab -->

**This is Tab 2.**

<!-- endtab -->

<!-- tab -->

**This is Tab 3.**

<!-- endtab -->

{% endtabs %}

{% note 'primary flat' 'fas fa-wand-magic-sparkles' %}
基础
{% endnote %}

{% tabs test1 %}

This is Tab 1.

This is Tab 2.

This is Tab 3.

{% endtabs %}

{% note 'primary flat' 'fas fa-wand-magic-sparkles' %}
预选择 tab
{% endnote %}

{% tabs test2 2 %}

This is Tab 1.

This is Tab 2.

This is Tab 3.

{% endtabs %}

{% endtabs %}

插件标签#

安装插件

npm i hexo-solitude-tag

Youtube#

Youtube 标签,用于显示 Youtube 视频。

{% tabs Youtube %}

{% youtube video_id [type] [cookie] %}
参数说明默认值
video_id视频 ID
type视频类型video
cookie是否使用 cookiefalse
{% youtube 'P2BTRcX0AV0' %}

{% youtube 'P2BTRcX0AV0' %}

{% endtabs %}

Bilibili#

Bilibili 标签,用于显示 Bilibili 视频。

{% tabs Bilibili %}

{% bvideo video_id %}
参数说明默认值
video_id视频 ID
{% bvideo 'BV1jb4y1j7eM' %}

{% bvideo 'BV1jb4y1j7eM' %}

{% endtabs %}

Audio#

Audio 标签,用于显示音频。

{% tabs Audio %}

{% audio url %}
参数说明默认值
url音频链接
{% audio 'https://music.163.com/song/media/outer/url?id=1973678968.mp3' %}

{% audio 'https://music.163.com/song/media/outer/url?id=1973678968.mp3' %}

{% endtabs %}

Video#

Video 标签,用于显示视频。

{% tabs Video %}

{% video url %}
参数说明默认值
url视频链接
{% video 'https://media.w3.org/2010/05/sintel/trailer.mp4' %}

{% video 'https://media.w3.org/2010/05/sintel/trailer.mp4' %}

{% endtabs %}

Videos#

Videos 标签,用于显示视频列表。

{% tabs Videos %}

{% videos [col] %}
{% endvideos %}
参数说明默认值
col列数1
{% videos 2 %}
{% video 'https://media.w3.org/2010/05/sintel/trailer.mp4' %}
{% video 'https://media.w3.org/2010/05/bunny/trailer.mp4' %}
{% endvideos %}

{% videos 2 %}
{% video 'https://media.w3.org/2010/05/sintel/trailer.mp4' %}
{% video 'https://media.w3.org/2010/05/bunny/trailer.mp4' %}
{% endvideos %}

{% endtabs %}

P#

没错,就是 P 标签。

{% tabs P %}

{% p [cls] [content] %}
参数说明默认值
cls类名
content内容

cls: center, left, right, h1, h2, h3, h4, h5, h6, red, green, blue, yellow, purple, orange, gray

{% p 'center h2' 'Hello World!' %}

{% p 'center h2' 'Hello World!' %}

{% endtabs %}

Span#

没错,就是 Span 标签。

{% tabs Span %}

{% span [cls] [content] %}
参数说明默认值
cls类名
content内容
{% span 'red h2' 'Hello World!' %}

{% span 'red h2' 'Hello World!' %}

{% endtabs %}

Fold#

折叠标签,用于显示折叠内容。

{% tabs Fold %}

{% fold 'title' open %}
content
{% endfold %}
参数说明默认值
title标题
open是否展开不填不显示
{% fold 'title' open %}
content
{% endfold %}

{% fold 'title' open %}
content
{% endfold %}

{% endtabs %}

Img#

图片标签,用于显示图片。

{% tabs Img %}

{% img url [alt] [style] %}
参数说明默认值
url图片链接
alt图片描述
style图片样式
{% img 'https://hsbc.com.cv/pic/avatar.jpeg/cover' 'cover' 'width: 200px' %}

{% endtabs %}

Inline Img#

内联图片标签,用于显示内联图片。

{% tabs InlineImg %}

{% inline_img url [alt] [style] %}
参数说明默认值
url图片链接
alt图片描述
style图片样式
{% inline_img 'https://hsbc.com.cv/pic/avatar.jpeg/cover' 'cover' '20px' %}

{% endtabs %}

Note#

Note 标签,用于显示提示。

{% tabs Note %}

{% note 'type' 'icon' %}
content
{% endnote %}
参数说明默认值
type类型
icon图标

type: primary, success, warning, danger, info, modern, flat, simple
icon: fantawesome 图标(例如: fas fa-mail)

{% note 'danger modern' 'fas fa-wand-magic-sparkles' %}
content
{% endnote %}

{% note 'danger modern' 'fas fa-wand-magic-sparkles' %}
content
{% endnote %}

{% endtabs %}

Card#

Card 标签,用于显示卡片。

{% tabs Card %}

{% card 'title','url','cover','score','desc','icon','tag','width','height' %}
参数说明默认值
title标题
url链接
cover封面
score评分
desc评价
icon图标
tag标签
width宽度
height高度
{% card '诡秘之主','https://book.qidian.com/info/1010868264/','https://bookcover.yuewen.com/qdbimg/349573/1010868264/300','4.5','第一次接触这种西方文学小说,刚开始感觉看不懂,断断续续看了很多次。后来越看越觉好看,每次看甚至都需要查“文档”','fa-solid fa-book-open','小说' %}

{% card ' 诡秘之主 ','https://book.qidian.com/info/1010868264/','https://bookcover.yuewen.com/qdbimg/349573/1010868264/300','4.5',' 第一次接触这种西方文学小说,刚开始感觉看不懂,断断续续看了很多次。后来越看越觉好看,每次看甚至都需要查 “文档”','fa-solid fa-book-open',' 小说 ' %}

{% endtabs %}

用于展示链接

{% tabs Link %}

{% link 'titke' 'subtitke' 'url' %}
参数说明默认值
title标题
subtitke副标题
url链接
{% link 'Solitude' '一款简洁优雅并易用的 Hexo 博客主题' 'https://solitude.js.org/zh' %}

{% link 'Solitude' ' 一款简洁优雅并易用的 Hexo 博客主题 ' 'https://solitude.js.org/zh' %}

{% endtabs %}

Checkbox#

展示复选框

{% tabs checkbox %}

{% checkbox 'style' 'checked' 'content' %}
参数说明默认值
style样式
checked是否选中checked
content内容
{% checkbox 'times red' checked '选中' %}
{% checkbox 'plus blue' 'checked' '未选中' %}

{% checkbox 'times red' checked ' 选中 ' %}
{% checkbox 'plus blue' 'checked' ' 未选中 ' %}

{% endtabs %}

Button#

展示按钮

{% tabs Button %}

{% button 'icon' 'content' 'url' %}
参数说明默认值
icon图标
content内容
url链接
{% button 'fas fa-wand-magic-sparkles' '按钮' 'https://hsbc.com.cv/zh' %}

{% button 'fas fa-wand-magic-sparkles' ' 按钮 ' 'https://hsbc.com.cv/zh' %}

{% endtabs %}

Github Repo#

展示 Github 仓库

{% tabs GithubRepo %}

{% github 'repo' %}
参数说明默认值
repo仓库
{% github 'dstansice/hexo-theme-solitude' %}

{% github 'dstansice/hexo-theme-solitude' %}

{% endtabs %}

Gitea Repo#

展示 Gitea 仓库

{% tabs GiteaRepo %}

{% gitea 'server' 'repo' %}
参数说明默认值
server服务器
repo仓库
{% gitea 'https://git.fsfe.org' 'FSFE/fsfe-website' %}

{% gitea 'https://git.fsfe.org' 'FSFE/fsfe-website' %}

{% endtabs %}

Gitee Repo#

展示 Gitee 仓库

{% tabs GiteeRepo %}

{% gitee 'repo' %}
参数说明默认值
repo仓库
{% gitee 'skycf/small-rocket-lua-file-backup' %}

{% gitee 'skycf/small-rocket-lua-file-backup' %}

{% endtabs %}

Gitlab Repo#

展示 Gitlab 仓库

{% tabs GitlabRepo %}

{% gitlab 'id' %}
参数说明默认值
id仓库 ID
{% gitlab 'gitlab-org/gitlab' %}

{% gitlab 'gitlab-org/gitlab' %}

{% endtabs %}

Bubble#

展示气泡

{% tabs Bubble %}

{% bubble 'content' 'notation' 'color' %}
参数说明默认值
content内容
notation符号
color颜色
{% bubble '我是一段文字内容,这是我写的东西' '我是提示文字' 'red' %}

{% bubble ' 我是一段文字内容,这是我写的东西 ' ' 我是提示文字 ' 'blue' %}

{% endtabs %}

Keyboard#

展示键盘按键

{% tabs Keyboard %}

{% keyboard 'key' %}
参数说明默认值
key按键
{% keyboard 'ctrl' %}

{% keyboard 'ctrl' %}

{% endtabs %}

Spoiler#

展示剧透

{% tabs Spoiler %}

{% spoiler 'style' 'content' %}
参数说明默认值
style样式blur / block
content内容
{% spoiler 'block' '我是一段文字内容,这是我写的东西' %}
{% spoiler 'blur' '我是一段文字内容,这是我写的东西' %}

{% spoiler 'block' ' 我是一段文字内容,这是我写的东西 ' %}
{% spoiler 'blur' ' 我是一段文字内容,这是我写的东西 ' %}

{% endtabs %}

Loading...
Ownership of this post data is guaranteed by blockchain and smart contracts to the creator alone.