目录
  1. 1. 引言
  2. 2. 添加Live2d看板动画
  3. 3. 本地预览效果
  4. 4. Live2d各个模型:
    1. 4.0.1. live2d-widget-model-chitose
    2. 4.0.2. live2d-widget-model-epsilon2_1
    3. 4.0.3. live2d-widget-model-haru_01
    4. 4.0.4. live2d-widget-model-haru_02
    5. 4.0.5. live2d-widget-model-haruto
    6. 4.0.6. live2d-widget-model-koharu
    7. 4.0.7. live2d-widget-model-hibiki
    8. 4.0.8. live2d-widget-model-miku
    9. 4.0.9. live2d-widget-model-hijiki
    10. 4.0.10. live2d-widget-model-tororo
    11. 4.0.11. live2d-widget-model-izumi
    12. 4.0.12. live2d-widget-model-nico
    13. 4.0.13. live2d-widget-model-nietzsche
    14. 4.0.14. live2d-widget-model-ni-j
    15. 4.0.15. live2d-widget-model-nipsilon
    16. 4.0.16. live2d-widget-model-nito
    17. 4.0.17. live2d-widget-model-shizuku
    18. 4.0.18. live2d-widget-model-tsumiki
    19. 4.0.19. live2d-widget-model-unitychan
    20. 4.0.20. live2d-widget-model-gf
    21. 4.0.21. live2d-widget-model-wanko
    22. 4.0.22. live2d-widget-model-z16
Hexo添加Live2d看板动画效果

引言

Hexo是一个快速、简洁且高效的博客框架,能够快速生成静态页面,只需一条指令即可部署到 GitHub Pages, Heroku 或其他网站,支持 GitHub Flavored Markdown 的所有功能,同时还拥有强大的插件系统。

为增添页面趣味性,这次主要介绍 Hexo 添加Live2d看板动画效果。

添加Live2d看板动画

看板动画

站点根目录下载插件,安装成功后,你可以在你的站点根文件夹/node_modules/底下找到live2d-widget这个文件夹。

1
npm install --save hexo-helper-live2d

安装你想要的live2d动画人物,这里选择 live2d-widget-model-koharu

1
npm install 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
22
23
24
#live2d看板动画
live2d:
enable: true
scriptFrom: local
pluginRootPath: live2dw/
pluginJsPath: lib/
pluginModelPath: assets/
tagMode: false
log: false
model:
use: live2d-widget-model-koharu
display:
superSample: 2
width: 150
height: 300
position: right
hOffset: 100
vOffset: -50
mobile:
show: true
scale: 0.5
react:
opacityDefault: 0.7
opacityOnHover: 0.2

本地预览效果

1
hexo clean && hexo g && hexo s

Live2d各个模型:

live2d-widget-model-chitose

live2d-widget-model-epsilon2_1

live2d-widget-model-haru_01

live2d-widget-model-haru_02

live2d-widget-model-haruto

live2d-widget-model-koharu

live2d-widget-model-hibiki

live2d-widget-model-miku

live2d-widget-model-hijiki

live2d-widget-model-tororo

live2d-widget-model-izumi

live2d-widget-model-nico

live2d-widget-model-nietzsche

live2d-widget-model-ni-j

live2d-widget-model-nipsilon

live2d-widget-model-nito

live2d-widget-model-shizuku

live2d-widget-model-tsumiki

live2d-widget-model-unitychan

live2d-widget-model-gf

live2d-widget-model-wanko

live2d-widget-model-z16

文章作者: GZ
文章链接: https://gz1903.github.io/2019/10/15/Hexo添加Live2d看板动画效果/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 GZ's Blog
打赏
  • 微信
  • 支付宝

评论