简介

放一只简简单单的看板娘, 没有什么互动, 安安静静的陪着你读博客.
插件github地址 —> hexo-helper-live2d
模型地址 —>模型
我的博客效果图 —> 磊大大’Blog

模块安装

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

准备工作

以live2d-widget-model-koharu模型为例

在博客根目录下创建一个live2d_models文件夹.
使用npm install live2d-widget-model-koharu下载模型, 并将模型目录live2d-widget-model-koharu从node_modules里复制到live2d_models下.
进入live2d-widget-model-koharu, 把assets里的内容复制到外一层.
添加如下配置文件, 并修改use的模型名称为live2d-widget-model-koharu, 部署即可看到效果.

配置

向博客根目录的_config.yml配置文件添加配置, 可以自己微调

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
live2d:
  enable: true
  scriptFrom: local
  pluginRootPath: live2dw/
  pluginJsPath: lib/
  pluginModelPath: assets/
  tagMode: false
  debug: false
  model:
    use: live2d-widget-model-koharu # 使用的模型名称
  display:
    position: right # 在页面里的位置
    hOffset: 0 # 水平偏移量, 自己微调
    vOffset: -20 # 垂直偏移量, 自己微调
    width: 150 
    height: 300
  mobile:
    show: true
  react:
    opacity: 0.7 # 透明度

模型

现有的模型包及预览

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
live2d-widget-model-chitose
live2d-widget-model-epsilon2_1
live2d-widget-model-gf
live2d-widget-model-haru/01 (use npm install --save live2d-widget-model-haru)
live2d-widget-model-haru/02 (use npm install --save live2d-widget-model-haru)
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
live2d-widget-model-z16