当前位置: 首页 > news >正文

Hexo+live2d | 如何把live2d老婆放进自己的博客

参考:
Hexo添加Live2D看板娘最新教程
live2d-widget
live2d-widget-models

网页/博客Hexo添加live2d游戏角色看板娘,简易添加,碧蓝航线等live2d新型游戏角色模型(moc3)
live2d-moc3
jsdelivr

方法1

可以直接去看参考文章的第一部分的第一篇。操作很简单就不说了。

方法2

很可惜方法1似乎对于cubism4.0以上的版本不成立,因为它不支持moc3格式的文件。所以我们这时候就需要采用方法2.

步骤:

  1. 在cubism editor中导出模型文件

注意这些选项的设置。

  1. fork该仓库

https://github.com/xiunianjun/AzurLaneL2DViewer

  1. clone你fork的仓库到本地,然后在asset文件夹中建立一个文件夹,将你的模型文件拖进去,并组织成如下目录结构

【新建文件夹】

【注意文件夹名字与模型名字要一致。把moc3、model3.json、physics3.json放在这里,有没有cdi3无所谓】

【在motion文件夹中放置动作json】

【在textures文件夹中放置贴图】

  1. 再把这些pull到你的仓库里

  1. 将其发布为一个release版本。我命名该版本为aaa

  1. 在你的博客根目录下的public中,将live2d-moc3中要求的代码插入到`index.html`中

注意,推荐插入在body标签结束前面一点点的位置,避免我们的live2d被渲染在最下层。

    <div class="Canvas"  id="L2dCanvas"></div><script>var config = {width: 800,height: 600,left: '750px',bottom: '-100px',basePath: 'https://cdn.jsdelivr.net/gh/xiunianjun/AzurLaneL2DViewer@aaa/assets/',//role: 'Tiger',role: 'aierdeliqi_4',// background: 'https://cdn.jsdelivr.net/gh/xiunianjun/AzurLaneL2DViewer@gh-page/assets/bg/bg_church_jp.png',opacity: 1,mobile: false}var v = new Viewer(config); </script>

注意修改basepath为`https://cdn.jsdelivr.net/gh/你的github名字/AzurLaneL2DViewer@你在5中的release版本命名/assets/`,role修改为3里面建立的文件夹名【同模型名】

  1. 然后执行hexo d就好啦。

注意,由于hexo-g会覆盖原来的index.html,故而第6步操作需要在每次generate对index.html进行重新生成后都做一遍,比较麻烦,但我暂时没找到什么好方法。

哪里写的不清楚或者有更好的方法,可以随时评论区/私信我交流。

http://www.lryc.cn/news/31476.html

相关文章:

  • 【微信小程序】-- 页面导航 -- 导航传参(二十四)
  • Pytorch学习笔记#2: 搭建神经网络训练MNIST手写数字数据集
  • C语言 猜名次、猜凶手、杨辉三角题目详解
  • 蚁群算法负荷预测
  • ubuntu添加系统服务实现开机root权限运行
  • 【阅读笔记】你不知道的Javascript--类与类型委托3
  • 文件服务设计
  • 【批处理脚本】-1.22-字符串界定符号 ““
  • 【Flutter·学习实践·UI篇】基础且重要的UI知识
  • 【OpenCV】车牌自动识别算法的设计与实现
  • SpringBoot发送邮件
  • BigInteger类和BigDecimal类的简单介绍
  • mysql五种索引类型---实操版本
  • 【微信小程序】-- 页面导航 -- 编程式导航(二十三)
  • 路由追踪工具 traceroute 使用技巧
  • NGINX学习笔记 - 一篇了解NGINX的基本概念(一)
  • Spring-Cloud-Gateway的过滤器的执行顺序问题
  • Android性能优化的底层逻辑
  • Gradle+SpringBoot多模块开发
  • Qt 之 emit、signals、slot的使用
  • 每日学术速递3.6
  • C# 将对象转换成字节数组(二进制数据)
  • 巾帼绽芬芳 一起向未来(下篇)
  • 代码还原小试牛刀(一):魔改的MD5
  • 6. 找大佬
  • 【CSS】标签显示模式 ① ( 标签显示模式 | 块级元素 )
  • hive真实表空间大小统计
  • 微信小程序引入Vant UI步骤
  • 【震撼发布】《致敬未来的攻城狮计划》| 文末赠书3本
  • 8.装饰者模式