1. 音乐外链
网易云音乐 :https://music.163.com/#/outchain/2/22559043/m/use
使用html5标签和七牛云外链
1
| <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=2&id=22559043&auto=1&height=66"></iframe>
|
2. 随机播放
云音乐无法实现多曲目选择;虾米可以多曲目外链,但无法实现随机选曲。
自己可以在Server或Client实现。但要实现Random Number居然需要写一个Custom Liquid Tag2 。另一个办法是,使用site.time
来获取事件然后直接使用,不过这个事件基于Generated Time
,只有rebuild这个时间才会改变,在Github Pages
上也不现实。
为了偷懒,此处使用Client实现。音乐网站每首曲子都有ID,并且iframe外链的src写的清清楚楚。我们在页面onReady
的时候加入一个新iframe即可:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
| $(function(){
arrMusicID = [1306046,26237342,22676185,,33469292,32648543,28287132,26511034,435305771,27588029,41462985,28656150,4010799];
musicID = Math.floor(Math.random()*(arrMusicID.length));
$('body').css('height',document.documentElement.clientHeight -5);
if (!Number.isInteger(arrMusicID[musicID])) return;
var iframe = document.createElement('iframe');
iframe.id="bgm";
iframe.style = "position: absolute; bottom: 0; left: 30px; border: 0px;";
iframe.src = '//music.163.com/outchain/player?type=2&id=' +arrMusicID[musicID]+ '&auto=1&height=32';
console.log(iframe.src);
iframe.frameborder="no";
iframe.marginwidth="0";
iframe.marginheight="0";
iframe.width=250;
iframe.height=52;
document.body.appendChild(iframe);
});
|
参考:
在jekyll模板博客中添加网易云模块
https://www.jianshu.com/p/b2306e9b7ba7
http://szhshp.org/
https://blog.csdn.net/u011475210/article/details/79023429