博客园右下角添加看板娘

看板娘

　　看板娘也就是别人博客右下角或者左下角的那个小人, 那如何把它加载到自己的博客园呢?

 

前提条件

　　必须需要申请开通支持JS代码, 否则以下内容也就不用看了

 

 

配置

侧边栏公告

　　将以下内容复制到: 博客侧边栏公告（支持HTML代码） （支持 JS 代码）

<div class="waifu" id="waifu">

        <div class="waifu-tips" style="opacity: 1;"></div>
        <canvas id="live2d" width="280" height="250" class="live2d"></canvas>
        <div class="waifu-tool">
            <span class="fui-home"></span>
            <span class="fui-chat"></span>
            <span class="fui-eye"></span>
            <span class="fui-user"></span>
            <span class="fui-photo"></span>
            <span class="fui-info-circle"></span>
            <span class="fui-cross"></span>
        </div>
        
</div>

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> 
<script src="https://blog-static.cnblogs.com/files/mswei/live2d.js"></script>
<script src="https://blog-static.cnblogs.com/files/mswei/waifu-tips.js"></script>
<script type="text/javascript">initModel()</script>

 

 

页首

　　将以下内容复制到: 页首 HTML 代码 

<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/mswei/waifu.css"/>
<link rel="stylesheet" type="text/css" href="https://files.cnblogs.com/files/yjlblog/flat-ui.min.css"/>

 

保存设置, 刷新页面, 左下角角就会多一个可爱的看板娘