为Blogger添加背景音乐

我的音乐播放依靠的是:SCM Music Player。

这个播放器的好处是比较小巧,唯一的缺点就是,当你点开音乐列表的时候有广告出现,也许这就是它的盈利模式,可以理解。

接下来开始介绍:


1.进入网址:进入


2.选择自己喜欢的皮肤,然后next


3.添加默认播放列表,比如我设置的这样,然后next


4.设置自动播放和其它选项,如图


5.这时就会生成代码,只需要把代码写入html中就可以了

代码像是这样:
<!-- SCM Music Player  -->
<script type="text/javascript" src="http://scmplayer.net/script.js"
data-config="{'skin':'skins/black/skin.css','volume':50,'autoplay':false,'shuffle':false,'repeat':1,'placement':'top','showplaylist':false,'playlist':[{'title':'%u81F3%u4E0A%u52B1%u5408 - %u68C9%u82B1%u7CD6','url':'https://www.youtube.com/watch?v=KXXz0oS_jvA'},{'title':'Sweety - %u6AFB%u82B1%u8349','url':'http://www.youtube.com/watch?v=vYcl7cw8gWo'},{'title':'%u97D3%u5E9A - %u5FC3%u75BC%u7B14%u8BB0%u672C','url':'https://www.youtube.com/watch?v=68ECDy0SlaA'}]}" ></script>
<!-- SCM Music Player script end -->

6.自定义播放列表

一般情况下,如果你的目的仅仅是实现一两首的背景音乐那么以上的教程就够了


但是,经过我半天的努力终于实现了如我的网页中的效果:自定义添加新的歌曲到列表中

此功能的目的是在原有的播放列表中添加新的歌曲

实现的原理:利用函数调用

实现代码:
<head>
<script>
function myFunction()
{
SCM.play({title:'此处为音乐名(如:Beyond - 岁月无声)',url:'此处为音乐的youtube链接(如:https://www.youtube.com/watch?v=QEOCahGzR08)'});
}
</script>
</head>

<body>
<button onclick="myFunction()">播放</button>
</body>
</html>

此代码写入与第5步同一个html代码中便可实现目的


问题:添加多首音乐时,无论点击那个“播放”按钮,都只唱第一首

答:添加多首时,把代码中的红色部分“myFunction()”改变成myFunction01(),myFunction02(),myFunction03(),记住,两处都要修改,以免调用错误!!!

20160503更新:
之前写的可能不是足够详细,再次更新一张图片,希望能帮助大家更好理解(点击放大):



原创博客,转载请注明网址,本页网址:http://honeyshine75.blogspot.com/2014/02/blogger-SCM-Music-Player.html

特别说明

由于众所周知的原因,本博客以往文章的图片无法显示,请谅解。

标签

生活纪实 (191) 感想 (114) ingress (54) 软件 (49) 小诗 (35) 梦境 (28) 教程 (21) 科幻 (21) 体会 (20) 杭州 (11) blogger (5) wordpress (5) Google adsense (4) Google voice (3) Chrome (2) Tensorflow (1) 谷粉 (1)

博客归档