slacr_

Just to record my life and thoughts.
笔记/编程/杂乱/极简

[博客建设四]hexo插件配置

Apr 4, 2023Blog854 words in 6 min

一些 hexo 插件的演示与具体的配置

cipher 加密:

U2FsdGVkX1/vnmtGGplTKaa5Ahugi/hpYQ5gT+7PVh1qQY/9Zpn9hpfoQwJN7Df/dNqo3nPGNEZODF0tH1UEAQ==
1
2
3
::: cipher (●'◡'●) 加密内容
(●'◡'●)这都能被你识破
:::
_config.inside.yml
1
2
3
4
5

- cipher:
placeholder: Passcode is required
excerpt: Content encrypted

palette 调色板

_config.inside.yml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

- palette:
col: 5
theme: [
'#673ab7',
'#3f51b5',
'#2196f3',
'#009688',
'#4caf50',
'#ff9800',
'#ff5722',
'#795548',
'#607D8B',
'#2a2b33'
]

bilibili 卡片

显示 b 站视频卡片的插件 link
{% bilicard your_video_id %}

clipboard 复制按钮

_config.inside.yml
1
2
3
4
5
6
7
8
9
10
11
12

# 全局导入 font-awesome 字体与 jQuery,

- //cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css
- //cdnjs.loli.net/ajax/libs/jquery/3.2.1/jquery.min.js

- position: [post, page]
template: |
<script type="text/javascript" src="//cdn.jsdelivr.net/npm/clipboard@2.0.4/dist/clipboard.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/gh/s1acr/my_jsDelivr@main/clipboard.js"></script>
<link href="https://cdn.jsdelivr.net/gh/s1acr/my_jsDelivr@main/clipboard.css" rel="stylesheet">

valine 评论

官方文档

_config.inside.yml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

- //code.bdstatic.com/npm/leancloud-storage@4.12.0/dist/av-min.js
- //unpkg.com/valine/dist/Valine.min.js
- position: comments
template: |
<div id="vcomments"></div>
<script>
new Valine({
el: '#vcomments',
appId: 'nppwTVm3zC7Giiu9rRKfkjkE-gzGzoHsz',
appKey: 'PrViE3tpVOff1CMwElCVGeqB',
path: window.location.pathname,
visitor: true,
recordIP: true,
admin_email: '2845391871@qq.com',
placeholder: 'Write a Comment',
avatar: 'retro'
})
</script>

不蒜子访客量统计

官方文档

_config.inside.yml
1
2
3
4
5
6
7
8
footer:
<span id="busuanzi_container_site_uv" style='display:none'>Total <b><span id="busuanzi_value_site_uv"></span></b> Visitors </span><span id="busuanzi_container_site_pv" style='display:none'><b><span id="busuanzi_value_site_pv"></span></b> Views</span><br>

plugins:

- position: sidebar
template: |
<script async src="https://cdn.jsdelivr.net/gh/s1acr/my_jsDelivr@main/busuanzi.js"></script>

本地显示的数据是不正确的, 部署完显示就正常了
这里引入的不是官方的 cdn 文件, 因为 live2D 会和不蒜子起冲突, 导致无法显示统计量.参考

live2D

导入模块

1
$ npm install --save hexo-helper-live2d

下载模型
参见:
可选择的模型地址: https://github.com/xiazeyu/live2d-widget-models
live2D 相关的项目有很多
https://github.com/EYHN/hexo-helper-live2d
https://github.com/stevenjoezhang/live2d-widget
选择你想要的, 这里是一只黑猫 hijiki

1
npm install --save live2d-widget-model-hijiki
_config.yml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

# 根目录中配置

live2d:
enable: true
scriptFrom: local
pluginRootPath: live2dw/
pluginJsPath: lib/
pluginModelPath: assets/
tagMode: false
debug: false
model:
use: live2d-widget-model-hijiki #这里改为你模型的名字
display:
superSample: 2
position: right
hOffset: 0
vOffset: -20
bottom: 100
width: 150
height: 200
mobile:
show: true
scale: 0.5
react:
opacity: 0.7
opacityDefault: 0.7
opacityOnHover: 0.9

有些配置不知道是组件起冲突了还是项目没有在维护的原因, 没有效果, 比如opacityOnHover

点击颜文字特效

_config.inside.yml
1
2
3
4
5
6
7

# 头像和侧边栏点击生成随机颜文字

- position: [avatar, sidebar]
template: |
<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/s1acr/my_jsDelivr@main/randomColorTextEmoticons.js"></script>

樱花飘零特效

_config.inside.yml
1
2
3
4
5
6
7

# 点击 sidebar footer 中的向日葵开启樱花飘落, 不通用, 我给#sunflower 绑定了一个事件

- position: sidebar
template: |
<script type="text/javascript" src="//cdn.jsdelivr.net/gh/s1acr/my_jsDelivr@main/Sakura.js"></script>

Algolia 搜索

作者写的很详细 link

  • Author:

    slacr_

  • Copyright:

  • Published:

    April 4, 2023

  • Updated:

    April 4, 2023

Buy me a cup of coffee ☕.

1000000