【博客优化】博客园增加背景音乐调用

 

　　在歌曲/歌单页面下，点击“生成外链播放器”（网易）、“转帖”（虾米）就可以看到歌曲的HTML代码了。这里以歌曲 Echo 为例，展示下两种不同播放器的区别。

<embed src="http://www.xiami.com/widget/0_1770124689/singlePlayer.swf"
 type="application/x-shockwave-flash"
 width="257"
 height="33"
 wmode="transparent">
</embed>

或者增加虾米音乐：

<iframe frameborder="no"
 border="0"
 marginwidth="0"
 marginheight="0"
 width=330 height=86
 src="http://music.163.com/outchain/player?type=2&id=18607260&auto=0&height=66"></iframe>

值得注意的是，虾米使用的是 embed 而网易云则是 iframe，而 iframe 有个很大的毛病，这个网易云也有提示——“很多博客网站不支持嵌入iframe，请试一下您的网站是否支持”。这些都不重要，重要的是博客园就不支持 iframe。当然要解决也很简单，把 iframe 替换成 embed 就行了，注意前后两个标记都要替换哦，此外，既然都没有 iframe 了，自然 frameborder 也可以去掉了，结果就是：

<embed border="0"
 marginwidth="0"
 marginheight="0"
 width=330 height=86
 src="http://music.163.com/outchain/player?type=2&id=18607260&auto=0&height=66"></embed>

 

注意：auto=1 为自动播放，0为不自动播放；width 和 height 修改前面的，根据自己的需要调整。

将外链播放器应用在博客园首页

剩下的就比较简单，大家都知道，进入博客园设置，复制之前得到的代码添加在 页首/页脚/公告 里，刷新一下博客页面，就可以看到播放器在页面上了。

<p style="text-align: center;"><iframe src="http://music.163.com/outchain/player?type=0&amp;id=66842568&amp;auto=0&amp;height=430" frameborder="no" marginwidth="0" marginheight="0" width="330" height="450"></iframe><iframe style="line-height: 1.5;" src="http://music.163.com/outchain/player?type=0&amp;id=91380370&amp;auto=0&amp;height=430" frameborder="no" marginwidth="0" marginheight="0" width="330" height="450"></iframe></p>
<p style="text-align: center;"><iframe src="http://music.163.com/outchain/player?type=0&amp;id=81981590&amp;auto=0&amp;height=430" frameborder="no" marginwidth="0" marginheight="0" width="330" height="450"></iframe><iframe src="http://music.163.com/outchain/player?type=0&amp;id=82197376&amp;auto=0&amp;height=430" frameborder="no" marginwidth="0" marginheight="0" width="330" height="450"></iframe></p>
<p style="text-align: left;">&nbsp;</p></div><div id="MySignature"></div>

其实简单来说就是一行代码搞定：

<embed src="//music.163.com/style/swf/widget.swf?sid=474034547&type=0&auto=1&width=420&height=645" width="330" height="450"  allowNetworking="all"></embed>