【个人博客网站】博客美化（四）：加入看板娘

本文最后更新于 about 2 years ago，文中所描述的信息可能已发生改变。

TIP提示

具体操作请参考以下文档： https://github.com/EYHN/hexo-helper-live2d/blob/master/README.zh-CN.md

安装插件

输入以下命令安装

shell

npm install --save hexo-helper-live2d

安装模型

npm安装

输入以下命令安装模型

shell

npm install --save {packagename}

模型名称模型名称

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

打开hexo配置文件或者主题配置文件，在里面输入配置内容

yaml

## Live2D
### https://github.com/EYHN/hexo-helper-live2d
live2d:
  enable: true #开关插件版看板娘
  scriptFrom: local ## 默认
  ## scriptFrom: https://cdn.cbd.int/[email protected]/lib/L2Dwidget.min.js ## 你的自定义 url
  tagMode: false ## 标签模式, 是否仅替换 live2d tag标签而非插入到所有页面中
  debug: false ## 调试, 是否在控制台输出日志
  model:
    use: live2d-widget-model-z16 ## npm-module package name
    ## use: https://unpkg.com/[email protected]/assets/koharu.model.json ## 你的自定义 url
  display:
    position: left #控制看板娘位置
    width: 150 #控制看板娘大小
    height: 300 #控制看板娘大小
  mobile:
    show: false ## 手机中是否展示
  react:
    opacityDefault: 0.7 ## 默认透明度
    opacityOnHover: 0.2 ## 鼠标移上透明度

本地安装

模型仓库: https://github.com/xiazeyu/live2d-widget-models

1.在博客的根目录中创建live2d_models文件夹

2.在live2d_models文件夹内按模型名称创建一个子文件夹

3.将模型复制到子文件夹

打开hexo配置文件或者主题配置文件，在里面输入配置内容

yaml

## Live2D
### https://github.com/EYHN/hexo-helper-live2d
live2d:
  enable: true #开关插件版看板娘
  scriptFrom: local ## 默认
  ## scriptFrom: https://cdn.cbd.int/[email protected]/lib/L2Dwidget.min.js ## 你的自定义 url
  tagMode: false ## 标签模式, 是否仅替换 live2d tag标签而非插入到所有页面中
  debug: false ## 调试, 是否在控制台输出日志
  model:
    use: /live2d_models/模型名称/模型名称.model.json
    ## use: https://unpkg.com/[email protected]/assets/koharu.model.json ## 你的自定义 url
  display:
    position: left #控制看板娘位置
    width: 150 #控制看板娘大小
    height: 300 #控制看板娘大小
  mobile:
    show: false ## 手机中是否展示
  react:
    opacityDefault: 0.7 ## 默认透明度
    opacityOnHover: 0.2 ## 鼠标移上透明度

安装插件 ​

安装模型 ​

npm安装 ​

本地安装 ​

恭喜，你有了一个可爱的看板娘 ​

安装插件

安装模型

npm安装

本地安装

恭喜，你有了一个可爱的看板娘