安装了一些稀奇古怪的插件,在这里记录一下用法免得自己忘了x
插件
可以在文章中插入steam游戏标签
用法:
也可以自己写标签中的简介:
1
| {% steamgame 1057090 "这游戏我至今没能通关,就一直在一直在迷路和死。" %}
|
还可以连续插入不止一个游戏:
1 2 3 4
| {% steamgames %} 271590 1057090 {% endsteamgames %}
|
1
| {% spoiler 这是一条被隐去的信息 %} <br>
|
这是一条被隐去的信息
1
| {% spoiler style:box 然后这个形式的隐去也蛮有意思的 %}
|
然后这个形式的隐去也蛮有意思的
1. 这是第一条消息^1
2. 在这里放一个参考^2
3. 参考内容也可以有换行^3
4. 也可以在参考里加上md语法(可惜悬浮窗口里不会渲染)[^4]
插件其实就这俩,但是hexo自带的一些格式也蛮好玩的,这里顺带着记录一下吧。
引用框
可以用来引用一些名人名言(?)
1 2 3
| {% blockquote [作者[, 来源]] [链接] [链接的名称] %} 内容 {% endblockquote %}
|
下面举些例子:
- 只有内容的一句引用
1 2 3
| {% blockquote %} 多米诺好强啊! {% endblockquote %}
|
多米诺好强啊!
- 从一本书中引用
1 2 3
| {% blockquote 多米诺, 多米诺讲故事 %} 多米诺好强啊! {% endblockquote %}
|
多米诺好强啊!
- 进行一个微博的引用
1 2 3
| {% blockquote @每日经济新闻 https: 根据相关法律法规,年假可以跨1个年度安排,今年年假可以安排到明年休;确因工作需要不能安排职工休年假的,单位应在征得职工本人同意后,根据职工应休未休假天数,按照该职工日工资收入的300%支付报酬 {% endblockquote %}
|
根据相关法律法规,年假可以跨1个年度安排,今年年假可以安排到明年休;确因工作需要不能安排职工休年假的,单位应在征得职工本人同意后,根据职工应休未休假天数,按照该职工日工资收入的300%支付报酬
代码框
这个就,代码框,蛮多地方用得上的。
1 2 3
| {% codeblock [标题] [lang:语言] [链接] [链接显示的文字] [附加参数] %} 这里是代码的内容 {% endcodeblock %}
|
附加参数 |
描述 |
默认值 |
line_number |
显示行号 |
true |
highlight |
启用代码高亮 |
true |
first_line |
自定义首行的行号 |
1 |
mark |
把特定的几行高亮,每个值之间用半角逗号, 分割,范围用短横线- 链接。比如: mark:1,4-7,10 就会高亮第1行,4到7行和第10行。 |
|
wrap |
把代码块用 ``包裹(这个我没搞太懂) |
true |
下面举些例子:
- 只有内容的代码块
只有内容的代码块1 2 3
| {% codeblock %} alert('Hello World!'); {% endcodeblock %}
|
显示就是这样:
- 定义高亮的语言
定义高亮的语言1 2 3
| {% codeblock lang:objc %} [rectangle setX: 10 y: 10 width: 20 height: 20]; {% endcodeblock %}
|
显示是这样(这个是抄Hexo官网文档的代码,其实我不懂objc是什么语言……)
1
| [rectangle setX: 10 y: 10 width: 20 height: 20];
|
- 给代码块加个标题
加个标题1 2 3
| {% codeblock Array.map %} array.map(callback[, thisArg]) {% endcodeblock %}
|
Array.map1
| array.map(callback[, thisArg])
|
- 给代码块加一个带链接的标题
加个带链接的标题1 2 3 4
| {% codeblock _.compact http: _.compact([0, 1, false, 2, '', 3]); => [1, 2, 3] {% endcodeblock %}
|
_.compactUnderscore.js1 2
| _.compact([0, 1, false, 2, '', 3]); => [1, 2, 3]
|
- 代码块的另一种写法
另一种写法1
| ``` [语言] [标题] [链接] [关联文字] 代码内容 ```
|
比如这样
1 2
| ```markdown 今天吃啥 https://blog.dominoh.com 多米诺好强啊 **多米诺好饿啊**```
|
最后会显示这样:
站内文章链接
最后再搬一个站内文章链接
站内文章引用1
| {% post_link 这里填文章的文件名,不需要后缀 %}
|
比如说
效果就是:
传统艺能
剩下的不想搬了,感觉用不太到,有兴趣的可以去Hexo的文档看看。
icarus主题由于用到了Bulma,所以有一些有趣的格式,这里记录几个可能用得上的:
按钮
按钮1 2 3 4 5 6
| <div class="buttons"> <button class="button is-info">Info</button> <button class="button is-success">Success</button> <button class="button is-warning">Warning</button> <button class="button is-danger">Danger</button> </div>
|
然后还可以给按钮增加点击触发的功能
点击按钮显示一言1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
| <button class="button is-info" onclick="showHitokoto(event)">显示一言</button> <blockquote class="hitokoto">↑↑↑ 试着点击“显示一言”!</blockquote>
<script> function showHitokoto (event) { event.target.classList.add('is-loading'); $.ajax({ type: 'GET', url: 'https://v1.hitokoto.cn/', success: function (data) { $('.hitokoto').text(data.hitokoto); event.target.classList.remove('is-loading'); } }); } </script>
|
↑↑↑ 试着点击“显示一言”!
进度条
进度条1 2 3 4 5
| <progress class="progress is-info" value="20" max="100"></progress> <progress class="progress is-success" value="40" max="100"></progress> <progress class="progress is-warning" value="60" max="100"></progress> <progress class="progress is-danger" value="80" max="100"></progress> <progress class="progress is-info" max="100"></progress>
|
黑块(又一个黑块)
黑块1 2 3 4 5
| <style type="text/css"> .heimu { color: #000; background-color: #000; } .heimu:hover { color: #fff; } </style> 多米诺好强啊{% raw %}<span class="heimu">屁嘞!</span>{% endraw %}
|
多米诺好强啊屁嘞!
封面图来源声明(其实可以算在按钮那一类里)
Vector Landscape Vectors by Vecteezy
封面图来源声明1 2 3 4
| <a class="tag is-dark is-medium" href="https://www.vecteezy.com/free-vector/vector-landscape" target="_blank"> <span class="icon"><i class="fas fa-camera"></i></span> Vector Landscape Vectors by Vecteezy </a>
|
这样
换好几行
[^4]: 比如可以 插一个链接