博客园看板娘的简单添加

  emmmm.....今年开始问我博客看板娘怎么添加的人多了起来,以前问个人,我都是告知其去了解Live2D的东西就好了,如今仍是顺手写一下吧。javascript

  对于前端,我一无所知,因此这边就直接引用别人的东西了。大概有以下两种方法(须要开通博客相关的CSS/JS权限)css

-------------------------------------第一种方法---------------------------------html

页面定制css 放上:
/* 看板娘 */
canvas#live2dcanvas {
border: 0 !important;
left: 0;
}
页脚Html代码放上:
/* 看板娘 */ 
<script src="https://cdn.jsdelivr.net/npm/live2d-widget@3.0.4/lib/L2Dwidget.min.js"></script>
<script type="text/javascript">
L2Dwidget.init();
</script>

 

-------------------------------------第二种方法-----------------------------------前端

页首:
<!-- 左下角live2d效果 -->
<script type="text/javascript" charset="utf-8" async="" src="https://cdn.jsdelivr.net/npm/live2d-widget@3.0.4/lib/L2Dwidget.min.js"></script>

页脚:
<!-- 左下角live2d效果 --> <script type="text/javascript"> setTimeout(()=>{ L2Dwidget.init({ "model": { "scale": 0.5 }, "display": { "position": "left", "width": 180, "height": 260, "hOffset": 0, "vOffset": -20 }, "mobile": { "show": true, "scale": 0.5 }, "react": { "opacityDefault": 0.7, "opacityOnHover": 0.2 } }); },1000) </script>

----------------------------------------------------------分割线----------------------------------------------------------------java

  有前端知识的看官,我推荐去看另外一位大佬的博客,应该是博客园中把博客装饰成二次元风格的全部人中Top10的存在,传送门:YJLAugusreact

  我由于前端知识的匮乏,致使如今这个看板娘没什么“灵魂”,之后但愿本身能作个满意的炮姐看板娘出来。npm

相关文章
相关标签/搜索