不知道该不该说二次元的力量是不是强大，有好多博客都写了相关的内容，非常可惜的是，我也是一名阿宅，不弄个看板娘说不过去。

代码

首先，需要申请博客园的 js 权限 ，步骤是：管理 -> 设置 -> js权限申请

接着就到页面html代码添加如下代码

• 引入 live2d 的 js：

要注意书写规范，同时奇怪的地方在于原来博客园默认的JS也不是HTML5中的type="text/javascript"，没有这个玩意，我们是无法做到JSONP跨域的

不然会报如下的错误:

Uncaught ReferenceError: L2Dwidget is not defined

<script type="text/javascript" charset="utf-8" src="https://files.cnblogs.com/files/liuzhou1/L2Dwidget.min.js"></script>

• 初始化 js ，加载模型

<script>
    L2Dwidget.init({
        "model": {
　　　　　　　jsonPath: "https://unpkg.com/live2d-widget-model-tororo@1.0.5/assets/tororo.model.json",
            "scale": 1
        },
        "display": {
            "position": "right", //模型的表现位置
            "width": 150,  //模型的宽度
            "height": 300, //模型的高度
            "hOffset": 0,
            "vOffset": -20
        },
        "mobile": {
            "show": true,
            "scale": 0.5
        },
        "react": {
            "opacityDefault": 0.7,  //模型默认透明度
            "opacityOnHover": 0.2
        }
    });
</script>

换模型

假如希望换成其他的模型，可以修改 jsonPath 的路径，格式为：https://unpkg.com/2D模型全名称@1.0.5/assets/模型.model.json ，在github中可选的模型有~，当然也可以看参考链接。

另外在另一篇博客的也提供了一个各个live2d人物的显示效果的网站

最终效果

现在右下角就有那只白猫了

参考

博客园添加live2d看板娘

文档

官方文档

国内文档hexo-helper-live2d | Easy Hexo

标签：看板娘,博客园,live2D,js,live2d,model,模型
来源： https://www.cnblogs.com/PaturNax/p/16548157.html