Live2d配置搭建已更新，详细查看移动端因Live2d造成的访问卡顿解决方案

前言

前俩天在逛Blog的时候看到了一只超可爱的看板娘，直接心动…遂往自己的blog中加入了经轻微改动的血小板！
以下提供2中不同的方法…可自行选择！

安装

插件安装：

1
npm install --save hexo-helper-live2d

模型安装：

模型的选择可以是自己制作的或是网上下载的，这里提供了作者的模型…

详细配置设置可以在Github项目查看 >传送<

第二选择

// 如果只需要显示看板娘而不需要其他的功能的话…使用以上方法就够了.


啊当然…如果需要一些功能，比如打招呼…对一些行为事件作出反应，就需要用到其他方法…

这个方法不需要安装 hexo-helper-live2d …

以下我将通过操作复述作者原话( emmmm….实际参考dalao的Github就可以完成…

0 × 01 准备

先到dalao的Github下载整理后的Live2d代码，解压到

\themes\’主题‘\source


目录下,重命名文件夹为Live2d

0 × 02 修改配置

我们不修改主题文件，所以在主题配置文件中外挂样式、脚本

inject配置项 bottom 中插入代码并确认路径正确：

1
- <link rel="stylesheet" href="live2d.css路径 如：/live2d/css/live2d.css" /><div id="landlord"> <div class="message" style="opacity:0"></div> <canvas id="live2d" width="280" height="250" class="live2d"></canvas> <div class="hide-button"><font color="#FFFFFF">隐藏</font></div></div>

接下来引入脚本并确认路径：

message 路径：

1
- <script type="text/javascript"> var message_Path = '/live2d/live2d'</script>

主页配置 此处修改为你的域名，必须带斜杠

1
- <script type="text/javascript"> var home_Path = '你的blog/' </script>

live2d.js路径

1
- <script type="text/javascript" src="/live2d/live2d/js/live2d.js"></script>

message.js

1
- <script type="text/javascript" src="/live2d/live2d/js/message.js"></script>

模型json路径

1
- <script type="text/javascript"> loadlive2d("live2d", "/live2d/live2d/model/XueXiaoban/XueXiaoban.model.json"); </script>

至此，就搭建好看板娘啦…至于模型动作 事件回应需要另外手动配置…

于模型.json中配置看板娘的动作···
message.json中配置事件回应···
js中拓展你所需要的功能…( 对应节日的提醒什么的


什么！你想让看板娘有玩游戏，换装的功能？
可以使用 live2d-widget , 要使用非官方模型需要搭建后台API····我还太菜:(