博客園看板娘的簡單添加


  emmmm.....今年開始問我博客看板娘怎么添加的人多了起來,之前問我的,我都是告知其去了解Live2D的東西就行了,現在還是順手寫一下吧。

  對於前端,我一無所知,所以這邊就直接引用別人的東西了。大概有如下兩種方法(需要開通博客相關的CSS/JS權限)

-------------------------------------第一種方法---------------------------------

頁面定制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>

----------------------------------------------------------分割線----------------------------------------------------------------

  有前端知識的看官,我推薦去看另一位大佬的博客,應該是博客園中把博客裝飾成二次元風格的所有人中Top10的存在,傳送門:YJLAugus

  我因為前端知識的匱乏,導致現在這個看板娘沒什么“靈魂”,以后希望自己能做個滿意的炮姐看板娘出來。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM