Argon Theme语法
本文最后更新于23天前,其中的信息可能已经有所发展或是发生改变。

Argon支持短代码,可以在文章中插入一些特殊内容,让文章的表达形式更加丰富。

短代码文档:https://argon-docs.solstice23.top/#/shortcode/readme

TODO复选框

  • 介绍:

该短代码可以插入一个复选框(不可互动)。

  • 用法:
[checkbox]默认复选框[/checkbox]
[checkbox checked="true"]已经完成的项目[/checkbox]
[checkbox checked="false"]还未完成的项目[/checkbox]
  • 参数:
参数名 可选值 默认值 解释 是否必须
checked true/false false 是否勾选复选框
inline true/false false 是否行内显示
  • 效果:



标签

  • 介绍:

该短代码可以插入一个标签。

  • 用法:
方形
[label]默认标签[/label]
[label color="indigo"]靛蓝标签[/label]
[label color="green"]绿色标签[/label]
[label color="red"]红色标签[/label]
[label color="blue"]蓝色标签[/label]
[label color="orange"]橙色标签[/label]
圆形
[label color="indigo" shape="round"]靛蓝标签[/label]
[label color="green" shape="round"]绿色标签[/label]
[label color="red" shape="round"]红色标签[/label]
[label color="blue" shape="round"]蓝色标签[/label]
[label color="orange" shape="round"]橙色标签[/label]
  • 参数:
参数名 可选值 默认值 解释 是否必须
color indigo/green/red/blue/orange indigo 标签颜色
shape square/round square 标签形状(方形/圆形)
  • 效果:

方形
默认标签
靛蓝标签
绿色标签
红色标签
蓝色标签
橙色标签
圆形
靛蓝标签
绿色标签
红色标签
蓝色标签
橙色标签

进度条

  • 介绍:

该短代码可以插入一个进度条。

  • 用法:
[progressbar progress="20"]默认进度条[/progressbar]
[progressbar progress="30" color="indigo"]靛蓝进度条[/progressbar]
[progressbar progress="40" color="green"]绿色进度条[/progressbar]
[progressbar progress="66" color="red"]红色进度条[/progressbar]
[progressbar progress="80" color="blue"]蓝色进度条[/progressbar]
[progressbar progress="100" color="orange"]橙色进度条[/progressbar]
[progressbar progress="23"][/progressbar]
[progressbar]没有指明参数的进度条[/progressbar]
[progressbar progress="66.66"]小数进度条[/progressbar]
  • 参数:
参数名 可选值 默认值 解释 是否必须
progress 0 ~ 100的数字 100 进度百分比
color indigo/green/red/blue/orange indigo 进度条颜色
  • 效果:

默认进度条
20%

靛蓝进度条
30%

绿色进度条
40%

红色进度条
66%

蓝色进度条
80%

橙色进度条
100%

23%

没有指明参数的进度条
100%

小数进度条
66.66%

提示

  • 介绍:

该短代码可以插入一个提示条。

  • 用法:
[alert]默认提示[/alert]
[alert color="indigo"]靛蓝提示[/alert]
[alert color="green"]绿色提示[/alert]
[alert color="red"]红色提示[/alert]
[alert color="blue"]蓝色提示[/alert]
[alert color="orange"]橙色提示[/alert]
[alert color="black"]黑色提示[/alert]
[alert title="我是标题" color="indigo"]带标题的提示[/alert]
[alert icon="flag" color="indigo"]带图标的提示[/alert]
[alert title="我是标题" icon="flag" color="indigo"]带标题和图标的提示[/alert]
  • 参数:
参数名 可选值 默认值 解释 是否必须
title 字符串 提示的标题
color indigo/green/red/blue/orange indigo 进度条颜色
icon Font Awesome 中的图标名称 (不带 fa-) 标题前的图标
  • 效果:

默认提示

靛蓝提示

绿色提示

红色提示

蓝色提示

橙色提示

黑色提示

我是标题 带标题的提示

带图标的提示

我是标题 带标题和图标的提示

警告

  • 介绍:

该短代码可以插入一个警告。

  • 用法:
[admonition]默认警告[/admonition]
[admonition title="我是标题" color="indigo"]靛蓝警告[/admonition]
[admonition title="我是标题" color="green"]绿色警告[/admonition]
[admonition title="我是标题" color="red"]红色警告[/admonition]
[admonition title="我是标题" color="blue"]蓝色警告[/admonition]
[admonition title="我是标题" color="orange"]橙色警告[/admonition]
[admonition title="我是标题" color="black"]黑色警告[/admonition]
[admonition title="我是标题" color="grey"]灰色警告[/admonition]
[admonition title="我是标题" icon="flag" color="indigo"]带标题和图标的警告[/admonition]
[admonition color="indigo"]不带标题的警告[/admonition]
[admonition title="只有标题的警告" color="indigo"][/admonition]
[admonition title="只有标题和图标的警告" icon="flag" color="indigo"][/admonition]
  • 参数:
参数名 可选值 默认值 解释 是否必须
title 字符串 警告的标题
color indigo/green/red/blue/orange grey 警告的颜色
icon Font Awesome 中的图标名称 (不带 fa-) 标题前的图标 (如果有标题)
  • 效果:

默认警告

我是标题
靛蓝警告

我是标题
绿色警告

我是标题
红色警告

我是标题
蓝色警告

我是标题
橙色警告

我是标题
黑色警告

我是标题
灰色警告

我是标题
带标题和图标的警告

不带标题的警告

只有标题的警告

只有标题和图标的警告

折叠区块

  • 介绍:

该短代码可以插入一个折叠区块,点击该折叠区块可以展开或收缩。

  • 用法:
[collapse title="默认折叠区块"]折叠的内容[/collapse]
[collapse title="靛蓝折叠区块" color="indigo"]折叠的内容[/collapse]
[collapse title="绿色折叠区块" color="green"]折叠的内容[/collapse]
[collapse title="红色折叠区块" color="red"]折叠的内容[/collapse]
[collapse title="蓝色折叠区块" color="blue"]折叠的内容[/collapse]
[collapse title="橙色折叠区块" color="orange"]折叠的内容[/collapse]
[collapse title="黑色折叠区块" color="black"]折叠的内容[/collapse]
[collapse title="灰色折叠区块" color="grey"]折叠的内容[/collapse]
[collapse title="无色折叠区块" color="none"]折叠的内容[/collapse]
[collapse title="显示左边框的折叠区块" showleftborder="true"]折叠的内容[/collapse]
[collapse title="带图标的折叠区块" icon="flag"]折叠的内容[/collapse]
[collapse title="默认展开的折叠区块" collapsed="false"]折叠的内容[/collapse]
  • 参数:
参数名 可选值 默认值 解释 是否必须
title 字符串 折叠区块标题
color indigo/green/red/blue/orange indigo 提示的颜色
icon Font Awesome 中的图标名称 (不带 fa-) 标题前的图标
collapsed true/false true 默认是否折叠
  • 效果:












默认展开的折叠区块
折叠的内容

友情链接列表

  • 介绍:

该短代码可以插入一个友情链接模块。

  • 用法:
[friendlinks/]
  • 参数:
参数名 可选值 默认值 解释 是否必须
style 1/1-square/2/2-big 1 友链列表的样式,样式1/样式1-方形头像/样式2/样式2-大头像
sort link_id: 按 ID 排序 url: 按链接排序 name: 按名称排序 owner: 按添加友链的用户排序 rating: 按评分排序 visible: 按可见度排序 length: 按长度排序 rand: 随机顺序 link_id 友链排序规则
order ASC:升序 DESC:降序 ASC 友链排序方式
  • 效果:

因为该功能已经被取代,所以这里不展示效果。

友情链接列表(旧)

  • 介绍:

该短代码可以插入一个友情链接模块。

  • 用法:
[sfriendlinks]
category|分组1
link|https://google.com|Google|谷歌|https://www.google.com/favicon.ico
link|https://github.com|Github
link|http://codeforces.com|Github|CF
category|分组2
link|https://bilibili.com|Bilibili|哔哩哔哩|
link|https://zhihu.com|知乎|分享你刚编的故事|
[/sfriendlinks]
  • 参数:
参数名 可选值 默认值 解释 是否必须
shuffle true/false false 随机顺序输出友链
  • 效果:

时间线

  • 介绍:

该短代码可以插入一个时间线模块。

  • 用法:
[timeline]
2000-1-1|这是标题|这是内容
2010-1-1|这是标题|我是内容|我是第二行内容
2019-12-31/23:59|左边的时间是换行的|在时间中,用 / 号表示一个换行符
[/timeline]
  • 参数:

  • 效果:
2000-1-1
这是标题
这是内容
2010-1-1
这是标题
我是内容
我是第二行内容
2019-12-31
23:59
左边的时间是换行的
在时间中,用 / 号表示一个换行符

隐藏文本

  • 介绍:

该短代码可以插入一段隐藏文本。
隐藏文本是一段无法直接看到的文本(模糊或者黑条),当鼠标移上后才会可见。

  • 用法:
[hidden]一段隐藏的文本[/hidden]
[hidden type="background"]黑条隐藏文本[/hidden]
[hidden type="blur"]模糊隐藏文本[/hidden]
[hidden tip="你知道的太多了"]鼠标停留会有提示[/hidden]
  • 参数:
参数名 可选值 默认值 解释 是否必须
type blur/background blur 隐藏的形式 (模糊/黑条)
color 字符串 鼠标移上一段时间后显示的话
  • 效果:

一段隐藏的文本
黑条隐藏文本
模糊隐藏文本
鼠标停留会有提示

GitHub信息卡

  • 介绍:

该短代码可以插入一个GitHub Repo信息卡,可以跳转到相应的GitHub Repo地址,显示介绍、Star数、Fork数预览。

  • 用法:
[github author="solstice23" project="argon-theme"][/github]
  • 参数:
参数名 可选值 默认值 解释 是否必须
author 字符串 欲展示的 Repo 的作者用户名
color 字符串 欲展示的 Repo 名
size full/mini full 尺寸
getdata frontend/backend frontend 前端/后端获取 Github Repo 信息
  • 效果:

视频

  • 介绍:

该短代码可以插入一个视频。

  • 用法:
[video url="https://xxxxx.com/xxxxx.mp4"][/video]
[video url="https://xxxxx.com/xxxxx.mp4" height="240" width="320"][/video]
[video url="https://xxxxx.com/xxxxx.mp4" autoplay="true"][/video]
  • 参数:
参数名 可选值 默认值 解释 是否必须
url 字符串 视频地址
width 整数 auto 视频宽度
height 整数 auto 视频高度
autoplay true/false false 是否自动播放
  • 效果:

由于没有视频文件,所以这里不展示效果。

发布时间/编辑时间

  • 介绍:

这两个短代码分别可以插入文章的发布时间和最后编辑时间。

  • 用法:
[post_time][/post_time]
[post_modified_time][/post_modified_time]
[post_time format="Y/n/j ag:i:s"][/post_time]
  • 参数:
参数名 可选值 默认值 解释 是否必须
format 字符串 Y-n-d G:i:s 时间格式
  • 效果:

2024-12-21 16:55:36
2024-12-29 21:19:12
2024/12/21 下午4:55:36

页脚引用(Ref)

  • 介绍:

该短代码可以在文章中插入一个引用。Argon 会在文章中存在引用时将所有引用于页脚生成列表,并在引用处生成引用标记并显示概览,点击可以在页脚和引用标记之间相互跳转。

  • 用法:
[ref]注释内容[/ref]
  • 参数:
参数名 可选值 默认值 解释 是否必须
id 字符串 两个相同 id 的 ref 会被合并在一起,Argon 会自动合并相同内容的 ref,但有时(当某些玄学情况发生时)你可能也需要 id 来手动合并
  • 效果:
[1]

让短代码不被解析

  • 介绍:

如果你不想让某段内容中的短代码被解析,想原样输出这段内容,只需要将这段内容用[noshortcode][/noshortcode]包裹即可。

  • 用法:
[noshortcode]
这段内容中的短代码将不会被解析
[alert]我不会被解析[/alert]
[/noshortcode]
  • 参数:

  • 效果:

这段内容中的短代码将不会被解析
[alert]我不会被解析[/alert]

参考

  1. ^注释内容
暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇