首先进入作者的GitHub,看看使用方法。
链接:hexo-helper-live2d
介绍:为你的hexo添加色气满满的live2d吧!
安装
1 | npm install --save hexo-helper-live2d |
配置
找到hexo根目录下的_config.yml
文件
在最后加上1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16# Live2D
## https://github.com/EYHN/hexo-helper-live2d
live2d:
model: z16 # 模型名称 默认值: z16
width: 150 # 宽度 默认值: 150
height: 300 # 高度 默认值: 300
scaling: 1 # 分辨率缩放倍率 默认值: 2
opacityDefault: 0.7 # 初始的透明度 默认值: 0.7
opacityHover: 1 # 鼠标悬浮时的透明度 默认值: 1
mobileShow: true # 是否在移动设备上显示 默认值: true
mobileScaling: 0.5 # 移动设备缩放倍率 默认值: 0.5
position: right # 模型左右侧放置位置 默认值: right
horizontalOffset: 0 # 元素的水平偏移 默认值: 0
verticalOffset: -20 # 元素的底部偏移 默认值: -20
id: live2dcanvas # 元素的id 默认值: live2dcanvas
deviceJsSource: local # current-device 脚本的来源 默认值: local
这段代码也可以直接从作者的链接上找到,上面有详细的参数介绍。
重点是修改model: z16
的值,我用的是hijiki
这个灰色小猫的模型。
生效
最后在\Hexo\themes\next\layout\_layout.swig
文件中</body>
的上方加上这行代码1
{{ live2d() }}
最后,就如你在我的博客左下角所看到的那只有动画效果的灰色小猫咯。