使用hexo在butterfly主题中开启看板娘配置教程(包括模型展示)

简介: 使用hexo在butterfly主题中开启看板娘配置教程(包括模型展示)

1.安装依赖


安装命令:npm install --save hexo-helper-live2d

卸载命令:npm uninstall hexo-helper-live2d

命令都是在你的博客主目录执行


安装完成之后在package.json会看到安装的model


2.下载模型


地址:https://github.com/xiazeyu/live2d-widget-models.git

博客主目录:使用 npm install {packagename}命令进行下载

例如:npm install live2d-widget-model-nico


45bd05c79dc84c668c3fb7570be00b53.png

模型选择:


live2d-widget-model-chitose
live2d-widget-model-epsilon2_1
live2d-widget-model-gf
live2d-widget-model-haru/01
live2d-widget-model-haru/02
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


3.使用模型


配置博客站点配置文件_config.yml


#看板娘
live2d:
  enable: true
  pluginModelPath: assets/
  model:
    use: live2d-widget-model-shizuku    #模板目录,在node_modules里,自己选择
  display:
    position: left
    width: 300 
    height: 600
  mobile:
    show: false  #是否在手机进行显示


ab6cc537720b465ab592c8afe7af8d56.png

4.模型展示


收集了一些我认为不错的模型,大家可以参考一下,如果觉得不好看,看一看也可以避坑

use: live2d-widget-model-nito


0944c05289cd4797b34fc2b3cb56639c.png


use: live2d-widget-model-nipsilon

03e3feae5f6f40eabc236bf0648f1fcf.png


use: live2d-widget-model-nietzsche

ebb2d3eef0be4c6899b88197ba08e3b3.png

use: live2d-widget-model-nico

ea646cd29d4e4554bb8a70f63eade7ac.png

use: live2d-widget-model-z16

ef51061e99cd43ce97abd38c425dac4b.png

use: live2d-widget-model-hibiki

bbc639fa53644ab091bcb3ab910c0429.png

相关文章
|
2月前
WordPress资源产品展示类主题 官网主题 CeoNova-Pro_v4.4
CeoNova-Pro主题是一款轻量级、且简洁大气、产品官网类主题,定位于高端产品官网、同时包含了知识付费、定制服务、问答社区、论坛交流、网址导航、以及付费产品购买下载等全方位覆盖。
40 0
|
6月前
【ripro美化】全站美化包WordPress RiPro主题二开美化版sucaihu-childV1.9(功能集成到后台)
1、【宝塔】删除ripro文件,上传最新ripro版本,然后上传压缩包内的ripro里面的对应文件到ripro主题对应内覆盖(找到对应路径单个文件去覆盖)。 2、然后上传ripro-chlid子主题美化包到/wp-content/themes路径下 3、注意顺序 原版–>美化包–>后台启用子主题(已启用请忽略)。
166 0
【ripro美化】全站美化包WordPress RiPro主题二开美化版sucaihu-childV1.9(功能集成到后台)
|
11月前
hexo主题集成pug
hexo主题集成pug
70 1
Butterfly安装文档(三)主题配置-1(二)
Butterfly安装文档(三)主题配置-1(二)
Butterfly安装文档(三)主题配置-1(三)
Butterfly安装文档(三)主题配置-1(三)
|
前端开发
Butterfly安装文档(三)主题配置-1(一)
Butterfly安装文档(三)主题配置-1
|
搜索推荐 应用服务中间件 nginx
typecho joe主题优化日志
博主使用了typecho进行博客网站的建立,也进行了一定程度上的修改优化。可从本文看到一系列美化方法。配置为 typecho1.2 php7.4
128 0
typecho joe主题优化日志
butterfly主题的下载及美化
butterfly主题的下载及美化
202 0
|
开发者
使用hexo在butterfly主题中开启看板娘配置教程(包括模型展示)
使用hexo在butterfly主题中开启看板娘配置教程(包括模型展示)
261 0
|
Shell 开发工具 git
Hexo系列(四) NexT主题配置
Hexo系列(四) NexT主题配置
178 0