给你的博客加上个Live2D看板娘吧

俗话虽说：“授人以鱼不如授人以渔”，但是由于这鱼比较难钓，我们还是乖乖搬个小板凳坐吃鱼群众吧！
以下代码是我光明正大从后宫学长那偷过来的鱼加以烹饪而成。

先到我的 Github 去下载我再次整理过后的live 2D的代码(包含两人的动作和初始的三套贴图)，毕竟还是煮熟的好吃点~

下载后解压代码到你的博客网站根目录去。（目录位置可以自定义）

然后把解压出来的文件夹改名为：live2d 。（叫啥无所谓，好看最重要）
(少女盲目分析中)

食用方法

然后就教大家怎么吃吧，呸，还真吃起来了

在你博客程序头部文件（header.php）引入界面样式，在 head 标签内插入如下代码：

<link rel="stylesheet" href="/live2d/css/live2d.css" />

在你博客程序页脚文件（footer.php）引入脚本，在 body 标签结束前插入如下代码：

<script type="text/javascript">
    var message_Path = '/live2d/'
    var home_Path = 'https://www.52ecy.cn/'  
</script>
<script type="text/javascript" src="/live2d/js/live2d.js"></script>
<script type="text/javascript" src="/live2d/js/message.js"></script>
<script type="text/javascript">
    loadlive2d("live2d", "/live2d/model/tia/model.json");
</script>

以上代码在使用绝对路径时要注意一个问题：
像我博客 www.52ecy.cn 和 52ecy.cn 都可以进行访问，但是如果在引用的时候使用了www，访问www.52ecy.cn的时候是没有问题，但在直接访问52ecy.cn的时候，会因为跨域问题(子域名不同也属于跨域)，导致json无法加载，然后你的看板娘就出不来了。
可以改为以下代码(人物的切换也只需改为相应的文件夹名字即可)

<script type="text/javascript">
    loadlive2d("live2d", "<?php echo 'http://'.$_SERVER['HTTP_HOST'].'/'; ?>live2d/model/Pio/model.json");
</script>

在合适的页面位置插入 Live2D 看板娘的元素，可以放在底部：

<div id="landlord">
    <div class="message" style="opacity:0"></div>
    <canvas id="live2d" width="280" height="250" class="live2d"></canvas>
</div>

鼠标放在页面某个元素上时，需要 Live2D 看板娘提示的请修改 message.json 文件。

{
    "mouseover": [
        {
            "selector": ".container a[href^='http']",  //此处修改为你页面元素的标签名
            "text": ["要看看 {text} 么？"]  //此处修改为你需要提示的文字
        },
        {
            "selector": ".navto-search",
            "text": ["在找什么东西呢，需要帮忙吗？"]
        }
    ],
    "click": [  //此处是 Live2D 看板娘的触摸事件提示
        {
            "selector": "#landlord #live2d",
            "text": ["不要动手动脚的！快把手拿开~~", "真…真的是不知羞耻！", "再摸的话我可要报警了！⌇●﹏●⌇", "110吗，这里有个变态一直在摸我(ó﹏ò｡)"]
        }
    ]
}

然后，刷新你的博客页面，看看效果吧！

注意路径别弄错了噢 ~
使用主题函数获取路径其实是很好的。
建议都使用绝对路径进行引用，而不是像列子中的相对路径

Pio

Tia

喵的，万恶的水印你走开！
具体效果你可以调戏一下本博客左下角的Pio(没错，我觉得她更可爱)