关于添加看板娘

因为觉得作者设置的页面左下角的网易云音乐并不实用所以将其改成看板娘

但是由于太菜，不能很好的理解live2d的官方文档

数次度娘都是一些不能用的版本，不是配置少双引号，就是路径错误，看了十几个博客竟没有一个是对的

点进博客根本就没有所谓的看板娘，看页面源码也都是error

几经搜索，终于在一个小时后找到正确配置之法

下面是我的设置，具体代码在html/pageFooter.html

<!-- 看板娘-->
<script src="https://cdn.jsdelivr.net/gh/Fofade/cnblogsThemes/live2dw/lib/L2Dwidget.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/Fofade/cnblogsThemes/live2dw/lib/L2Dwidget.0.min.js"></script>
<script>L2Dwidget.init({"model": {"scale": 1,"hHeadPos": 0.5,"vHeadPos": 0.618,"jsonPath": "https://cdn.jsdelivr.net/gh/Fofade/cnblogsThemes/live2dw/assets/z16.model.json"},"display": {"superSample": 2,"width": 100,"height": 220,"position": "left","hOffset": 0,"vOffset": -20},"mobile": {"show": true,"scale": 0.5},"react": {"opacityDefault": 0.7,"opacityOnHover": 0.2}});</script>
<div id="live2d-widget"><canvas id="live2dcanvas" width="200" height="440"style="position: fixed; opacity: 1; left: 0px; bottom: 0; z-index: 99999; pointer-events: none;"></canvas>
</div>

若自定义只需要将对应的文件链接修改即可

live2dw内的文件是由hexo自动生成的

如果需要换模型最简单的办法是去别人的博客看页面源码，把它的对应链接拷过来(比如我的链接0.0)！
当然也可以自己生成。

注意：由于浏览器的跨域限制，对于自行引入的看板娘js应当使用cdn(推荐使用jsDeliver+Github方式)

样例可以看我的Github cnblogsThemes

转载于:https://www.cnblogs.com/fofade/p/11309284.html

解决博客园添加hexo看板娘无法加载问题相关推荐

博客园添加live2D看板娘和樱花飘落背景
写在前面本文主要描述了怎么给博客园添加看板娘和樱花飘落特效,文章可能还有很多不足,请大家谅解,欢迎大佬提意见. 本文使用的东西 live2d(看板娘) 樱花飘落博客园文章目录写在前面本文使用 ...
博客园添加Live2d看板娘
最近给自己的博客添加了个动态的小萝莉,给大家分享一下,效果请见我的博客左下角: (当然你也可以在自己的html页面引入下面的js来添加小萝莉) 1.首先最重要的一点你要申请一个博客园账号. 2.其次申 ...
【分享】给自己的博客园添加一个板娘（可选）
全部样式分享更换模型的话只需要更换jsonpath中的模型名称即可 https://unpkg.com/live2d-widget-model-模型名称/assets/模型名称.model.json ...
博客园增加Live2D看板娘教程，超级简单，一看就懂
目录一.前言二.效果图三.资源准备 1.相关的资源,可以点击下面的网盘链接直接下载 2.也可以通过下面的地址到Gitbuh中下载四.实现教程 1.个人小站实现教程 2.博客园实现教程一.前言 ...
css文件插入背景音乐,博客园添加背景音乐,背景效果!
博客园添加背景音乐,背景效果申请博客园js权限申请话术实例尊敬的博客园管理员: 请求申请开通js权限,希望能够把自己的博客修饰的漂亮点,点缀自定义js插件效果,希望管理员可以批准,谢谢! 开通 ...
为博客园添加github跳转链接
一般程序员都会有自己的github仓库,在博客园添加跳转链接,可以很方便的进行访问查看. 添加html 首先,需要在设置中添加一段html,用于跳转链接 <a class="git-l ...
博客园添加鼠标粒子吸附特效
本文从以下三个方面, 阐述在博客园添加鼠标粒子吸附特效: 一. 效果展示二. 权限申请三. 设置步骤一. 效果展示在博客园的页面, 出现鼠标粒子吸附的特效, 如图所示: 二. 权限申请点击博 ...
博客园添加访问人数统计超详细教程
先看添加后的效果吧: 是不是还可以,下面就是教程了,简单易学,支持多种风格. 1. 登录http://www.amazingcounters.com/sign-up.php 这个地址去申请一个帐户 ...
博客园添加一个分享的
给自己的博客添加一个分享的按钮吧!! 可以遇见更多志同道合的人呀!!! 使用百度的一键生成按钮就可以了:http://share.baidu.com/code 或者自己写一个也是一样的 <!-- ...

解决博客园添加hexo看板娘无法加载问题

关于添加看板娘

解决博客园添加hexo看板娘无法加载问题相关推荐

最新文章

热门文章