零基础学习GitHub桌面版-10给博客添加萌萌的live2d插件

零基础学习GitHub桌面版-10给博客添加萌萌的live2d插件

1 效果预览

我们希望在网站上显示一个好看的动漫形象,live2d这个库完美的解决了我们的需求。

单个效果预览:image

所有动画效果:https://huaji8.top/post/live2d-plugin-2.0/

2 安装过程

2.1 安装总插件

在hexo的根目录下执行

1
npm install --save hexo-helper-live2d

2.2 安装喜欢的具体模型

安装完总插件后,可以安装喜欢的模型

所有动画效果可以在这个网站观看:https://huaji8.top/post/live2d-plugin-2.0/

选择一个自己喜欢的,比如tororo(白猫),下载具体的模型:

在根目录下执行:

1
npm install live2d-widget-model-tororo

(喜欢别的形象就把tororo换成别的名字)

2.3 移动模型地址

  1. 从hexo的根目录的node_modules中找到刚刚安装的模型文件夹,比如我这里安装的是:live2d-widget-model-tororo ;复制这个文件夹
  2. 在hexo的根目录创建名为live2d_models的文件夹
  3. 把之前找到的的模型文件夹从node_modules文件夹复制到live2d_models中

2.4 配置使用

在hexo根目录下的_config.yml中的最后面添加以下内容

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

3 成功

大功告成,部署博客即可。

hexo -d -g

效果如下:

# Git, GitHub

评论

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×