live2d-widget-model-chitose
我们平常访问某些网站的时候,会发现在网站上总是悬浮者一个可爱的小人.而且还可以跟用户进行各种互动(说话?).
一般这种小人都是通过js加载出来的, 搜索关键词网上有教程. 不过我今天在这里记录的是,如何添加2.5D互动小人
平台: hexo + hexo-plugins(live2d-widget-models)
同时也支持jekyll, wordpress, etc.
安装
sudo npm install --save hexo-helper-live2d
项目github地址
https://github.com/xiazeyu/live2d-widget-models
然后在_config.yml(hexo或者主题的都行)中添加
live2d:
enable: true
scriptFrom: local
model:
use: live2d-widget-model-wanko //使用的模型名,下面会详细讲
display: //如果觉得默认定位不满意可在此微调,bottom
position: right
width: 150
height: 300
bottom:-30
mobile:
show: true
自定义模型的使用点我
hexo下现有模型的安装
npm install {packagename}
安装示例
sudo npm install live2d-widget-model-chitose
最新版现有模型测试与预览
OK, 这是重点[哭笑不得],
现实效果是会动的, 由于截gif过于麻烦, 我就只好截屏了. 现实效果绝对比这帅.
live2d-widget-model-chitose
live2d-widget-model-chitose
唔, 这是一个美少年. 比较适合女生. 我就不用这个了.
live2d-widget-model-epsilon2_1
live2d-widget-model-epsilon2_1
一个夏装妹子, 比较适合宅男
live2d-widget-model-gf
live2d-widget-model-gf
一个卡通人物(废话), 很炫酷
live2d-widget-model-haru
这个模型需要两点注意,
- 它的安装方式是
npm install live2d-widget-model-haru
模型的使用却是
use: live2d-widget-model-haru/01 或者
use: live2d-widget-model-haru/02
这是因为他这个包里有两个模型的原因
- 它在子模型下的json文件是空的,
所以你要将/博客路径/node_modules/live2d-widget-model-haru/package.json复制进01, 02 文件夹.
live2d-widget-model-haru/01
live2d-widget-model-haru/01
live2d-widget-model-haru/02
live2d-widget-model-haru/02
live2d-widget-model-haruto
live2d-widget-model-haruto
live2d-widget-model-hibiki
live2d-widget-model-hibiki
吐槽一句, 这位同学太高了,已经把我电脑屏幕高快全占了
live2d-widget-model-izumi
live2d-widget-model-izumi
live2d-widget-model-koharu
live2d-widget-model-koharu
是不是有些熟悉? 这妹妹跟haruto是情侣啊!
live2d-widget-model-miku
live2d-widget-model-miku
live2d-widget-model-ni-j
live2d-widget-model-ni-j
live2d-widget-model-nico
live2d-widget-model-nico
live2d-widget-model-nietzsche
live2d-widget-model-nietzsche
live2d-widget-model-nipsilon
live2d-widget-model-nipsilon
live2d-widget-model-nito
live2d-widget-model-nito
live2d-widget-model-shizuku
live2d-widget-model-shizuku
live2d-widget-model-tororo
live2d-widget-model-tororo
live2d-widget-model-tsumiki
live2d-widget-model-tsumiki
live2d-widget-model-unitychan
live2d-widget-model-unitychan
live2d-widget-model-wanko
live2d-widget-model-wanko
live2d-widget-model-z16
live2d-widget-model-z16
总结
我把官网所有的模型都装了一次, 最后发现一个规律, 那就是模型妹子偏多. 看来技术宅喜欢动漫少女的说法基本正确. 由于我装了一个多小时的模型, 已经对此有些反感了, 所以就保留最后一个不换了. 想看效果的可以电脑端访问https://www.thinkmoon.cn 看效果
mobile 的值决定了在手机端是否显示
由于显示会影响阅读,我这儿设为false
