【博客園使用小指南】DIY美化博客園指南

1、添加音樂播放器（例如 網易雲音樂）

【html5 音樂播放器】

源碼

GitHub - MoePlayer/APlayer: Wow, such a beautiful HTML5 music player

中文使用指南

https://aplayer.js.org/#/zh-Hans/?id=cdn

cdn鏈接

https://cdnjs.com/libraries/aplayer

（1）添加html代碼 （事先需要申請並通過 博客園的JS 許可權 ）

【博客園後臺管理】——【設置】——【頁腳Html代碼】——粘貼以下代碼(下麵的播放器 是 迷你版的，更多樣式 可以參考 播放器源碼文件)

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/APlayer.min.css">
<script src="https://blog-static.cnblogs.com/files/yjlaugus/APlayer.min.js"></script>
<div id="aplayer" class="aplayer"  data-id="3220493480" data-server="netease" data-type="playlist" data-fixed="true" data-listfolded="true" data-order="random" data-theme="#F58EA8"></div>
<script src="https://unpkg.com/[email protected]/dist/Meting.min.js"></script>

（2）獲取歌單鏈接，修改上面代碼的  data-id="3220493480" 

如何獲取歌單 id 呢？

（現在網頁版和PC版的網易雲音樂 歌單界面 沒有生成“外鏈播放器‘的功能了。。）

使用 移動端（手機）分享一個歌單，分享方式選為”複製鏈接“；

例如 我用手機 網易雲APP 分享自己的一個歌單：

分享錦蝶生創建的歌單「老樹花開錦蝶生」: http://music.163.com/playlist/3220493480/438654155/?userid=438654155 (來自@網易雲音樂)

歌單 id 就是 playlist 後面的 3220493480，修改代碼 data-id="3220493480"。保存後，重新進入博客園個人主頁就可以聽心愛的歌啦~

（3）最後效果

【參考閱讀】

https://www.cnblogs.com/guanxiying/category/1652463.html

https://www.zhihu.com/question/37316681