提示：當你看到這個提示的時候，說明當前的文章是由原emlog博客系統搬遷至此的，文章發佈時間已過於久遠，編排和內容不一定完整，還請諒解`
給你的博客加上個 Live2D 看板娘吧
日期：2017-12-24 阿珏 折騰代碼 瀏覽：10584 次 評論：43 條
前段時間，在不少人博客看到這個 Live2D 看板娘，頗感興趣！就查閱了點相關教程為自個博客也添加上了
前言 #
本文章中所用模型解包自 藥水製作師 手機遊戲，版權歸該官方所有。(沒錯，我也是來安利這款遊戲的)live2d 並不是一種先進的技術，它產生的效果，都是用基本的平移、旋轉、透明、曲面變形等操作實現的。最終的效果與貼圖關係很大，而每一個動作，都需要製作師的精細調整。這是一個需要消耗大量時間精力的過程，因此質量好的模型並不多，質量好的也一般是在遊戲中，版權受到保護， 不能隨意使用 。
準備工作 #
以下代碼是我 光明正大 從 後宮學長 那偷過來的魚加以烹飪而成。
先到我的 Github 去下載我再次整理過後的live 2D的代碼( 包含兩人的動作和初始的三套貼圖 )，畢竟還是煮熟的好吃點~
下載後解壓代碼到你的博客網站根目錄去。（目錄位置可以自定義）
然後把解壓出來的文件夾改名為：live2d 。（叫啥無所謂，好看最重要）
(少女盲目分析中)
食用方法 #
然後就教大家怎麼吃吧，呸，還真吃起來了
在你博客程序頭部文件（header.php）引入界面樣式，在 head 標籤內插入如下代碼：
在你博客程序頁腳文件（footer.php）引入腳本，在 body 標籤結束前插入如下代碼：
以上代碼在使用絕對路徑時要注意一個問題：
像我博客 www.52ecy.cn 和 52ecy.cn 都可以進行訪問，但是如果在引用的時候使用了www，訪問www.52ecy.cn的時候是沒有問題，但在直接訪問52ecy.cn的時候，會因為跨域問題(子域名不同也屬於跨域)，導致json無法加載，然後你的看板娘就出不來了。
可以改為以下代碼(人物的切換也只需改為相應的文件夾名字即可)
在合適的頁面位置插入 Live2D 看板娘的元素，可以放在底部：
鼠標放在頁面某個元素上時，需要 Live2D 看板娘提示的請修改 message.json 文件。
然後，刷新你的博客頁面，看看效果吧！
注意路徑別弄錯了噢 ~
使用主題函數獲取路徑其實是很好的。
建議都使用絕對路徑進行引用，而不是像列子中的相對路徑
成品效果欣賞 #
Tia
喵的，萬惡的水印你走開！
具體效果你可以調戲一下本博客左下角的Pio(沒錯，我覺得她更可愛)
結語 #
關於如何進行換裝play 請參考原作者( 貓和向日葵 )的這篇文章《 給博客添加能動的看板娘(Live2D)-關於模型的二三事 》請注意本文中出現的 “藥水製作師”、“Potion Maker”字樣及應用內包含的文本、模型、圖片、動作數據等所有權均屬於 “藥水製作師”作者 Sinsiroad，僅供研究學習，不得用於商業用途
網友評論：
路人甲 7 個月前 (2020-09-03)
真優秀
6666666 9 個月前 (2020-07-24)
我想用站長現成的看板娘，可以打包分享嗎 [# 得意]
錯錯. 1 年前 (2020-01-23)
真實的回到分為負二負一
阿珏 1 年前 (2020-01-24)
@錯錯.：對方不是很懂你的意思，於是送了你個帽子 [#aru_136]
ICON 1 年前 (2019-11-23)
第一個紫色圖標裡面一個 v 的是個啥軟件哦 [#aru_21]
@ICON：查看模型使用的是 LIVE2D 官方提供的 Live2D Viewer
龗尧 2 年前 (2019-04-18)
追問
留的 ip 地址、然後
看板娘顯示不出來
這是為什麼呢？
@龗尧：聽不懂
龗尧 2 年前 (2019-04-21)
@阿珏：啊... 您好這是我的博客：http://www.zhangyyao.com/
具體講起來確實感覺很難表達
您可以點進去看一看
麻煩了（捂臉）
還可以長期保持聯繫嗎？（我怕我問著問著就不回覆我了）
@龗尧：很正常啊 ，不用看啊 ，想保持長期聯繫可以加群，群號自己找 [#wb_doge]
"合適的頁面位置插入 live2D 元素" 底下這行代碼是放到 footer.php 裡面嗎？
順便求看板娘換裝（星星眼恳切）
@龗尧：都行，換裝你去我友鏈裡 FGHRSH 博客裡去找新版的
蘇哲 2 年前 (2019-02-15)
是不是跟知更鳥主題有衝突，加了之後網站文章的圖片 就不顯示了
@蘇哲：那可能就是有些地方有衝突了，具體哪裡這就很難講
QQ 帳號錯誤 2 年前 (2019-01-06)
皮膚給一下呗
mynamezhf@gmail.com謝謝啦
wa 2 年前 (2018-11-11)
大佬你好根據這個 还有廣樹 typecho 插件和 imjad.cn 大佬的血小板
集成了一個https://github.com/samondlee/typecho_Live2dHistoire1/tree/master/Live2dHistoire
但是發現不能像你的一樣 截圖、換裝 也不能像貓與向日葵大佬 的血小板一樣蹦蹦跳跳為啥呀呜呜呜
明明動畫都加載了
@wa：不能蹦跶可能是動作文件有問題吧，截圖換裝不能那應該是 js 文件出問題了。具體的我也不是很清楚，用現成的多好啊。哈哈
失去才會珍惜 2 年前 (2018-11-07)
## 這篇評論是私密評論 ##
@失去才會珍惜：去 17 素材網可以搜索到
Į 2 年前 (2018-09-01)
能不能給普通的網頁加上看板娘呢 [#aru_1]
@Į：而且我這文字是出來了 就是動畫模型一直出不來
@Į：理論都是可以的，只要不衝突
晨熙 2 年前 (2018-08-24)
表白牆可以放這個嗎？？
@晨熙：理論都可以的
交際貓 2 年前 (2018-07-20)
代碼無法複製 233 [#aru_113]
牧羊 2 年前 (2018-07-14)
複製不了那些代碼，還有想要貴站的換裝，謝謝了
易小獨 2 年前 (2018-07-09)
為了那到那些框框代碼 我把開發者弄出來 結果電腦死了半小時 [#aru_15]
@易小獨：真是灰常抱歉了，你可以來找我給你的
@阿珏：我要
劉德華 2 年前 (2018-07-19)
@易小獨：chrome 裡禁用斷點就好啦～[#(哈哈)]
@劉德華：別說出來，噓～
楊小杰博客 2 年前 (2018-05-10)
這姑娘 6
@楊小杰博客：你喜歡就好
henry 2 年前 (2018-05-10)
## 這篇評論是私密評論 ##
[#aru_42] 其他網站程序可以添加嘛。例如我這個。
@henry：理論上都可以的
冷夢丶 2 年前 (2018-04-08)
[#aru_18] 你這個板娘的分不分享呀～[#aru_91]
星星 2 年前 (2018-03-30)
求皮膚 謝謝 [#aru_1]
求皮膚 謝謝 [#aru_1]
inpm 3 年前 (2018-03-13)
+1 求皮膚
inpm.cy@gmail.com
pony 4 年前 (2018-01-28)
= =，想要貴站的刷新換衣服的方法。
@pony：網址或 qq 都不願意留下，你想我怎麼給你？
′千玄 4 年前 (2018-02-22)
@阿珏：換衣服這個細節還沒注意，厲害了～