【笔记】给博客装个看板娘（“博客宠物”）

1.需要用到的工具和环境

工具：hexo-helper-live2d 插件

环境：npm、git

2.安装live2d插件

1
npm install --save hexo-helper-live2d

3.选择一个喜欢的模型

这里搜集到了一些模型可供参考：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
live2d-widget-model-chitose
live2d-widget-model-epsilon2_1
live2d-widget-model-gf
live2d-widget-model-haruto
live2d-widget-model-hibiki
live2d-widget-model-hijiki
live2d-widget-model-izumi
live2d-widget-model-koharu
live2d-widget-model-miku
live2d-widget-model-ni-j
live2d-widget-model-nico
live2d-widget-model-nietzsche
live2d-widget-model-nipsilon
live2d-widget-model-nito
live2d-widget-model-shizuku
live2d-widget-model-tororo
live2d-widget-model-tsumiki
live2d-widget-model-unitychan
live2d-widget-model-wanko

4.然后执行指令↓

1
npm install live2d-widget-model-koharu //假设你选择的看板娘是koharu

5.修改博客配置文件

找到博客目录下的 ## \_config.yml 添加下面的内容

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
#Live2D动画
live2d:
  enable: true
  scriptFrom: local
  pluginRootPath: live2dw/
  pluginJsPath: lib/
  pluginModelPath: assets/
  tagMode: false
  debug: false
  model:
    use: live2d-widget-model-koharu 
  display:
    position: right 
    width: 150
    height: 300
  mobile:
    show: true

live2d: - 这是配置节的开始，表示接下来的设置都是关于 Live2D 插件的。

enable: true - 这个设置项表明 Live2D 插件是启用的。

scriptFrom: local - 这表示 Live2D 插件的脚本将从本地加载，而不是从远程服务器。

pluginRootPath: live2dw/ - 这是 Live2D 插件文件的根目录路径，所有的插件文件都会从这个目录下加载。

pluginJsPath: lib/ - 这是存放 Live2D 插件 JavaScript 文件的目录路径。

pluginModelPath: assets/ - 这是存放 Live2D 模型文件的目录路径。

tagMode: false - 这个设置项表明不使用标签模式，即不通过特定的 HTML 标签来控制 Live2D 模型的显示。

debug: false - 这个设置项表明不启用调试模式，通常在调试模式下会有额外的日志输出，有助于开发者调试问题。

model: - 这个配置节包含了模型相关的设置。

use: live2d-widget-model-koharu - 这指定了要使用的 Live2D 模型的名称，这里的模型名为 “live2d-widget-model-koharu”。

display: - 这个配置节包含了显示相关的设置。

position: right - 这指定了 Live2D 模型在页面上的位置，这里是在右侧。

width: 150 - 这是 Live2D 模型的宽度，单位通常是像素。

height: 300 - 这是 Live2D 模型的高度，单位也是像素。

mobile: - 这个配置节包含了移动端相关的设置。

show: true - 这表明在移动端设备上也会显示 Live2D 模型。