标题刚写出来，感觉有点吹牛了啊。。。小新也不能把全部可用的音乐播放器找出来^-^，小新只是分享几款常用的，或者是简洁方便的。或者大家都知道了。。。那小新就自个当个备份吧。有时候要用的时候光凭想还真没办法打出来。
OK，先来说说第一款，也是小新博客之前常用的这款：HTML5 audio（mediaelementjs）
这个是可以直接在博客里面调用的，也是使用最新的HTML5超文本标记语言，可以做音乐播放器，也可以做为视频播放器。
因为大部分的网站都支持HTML5了，所以实用性毋庸置疑了，当然最方便的是可以直接右键下载视频或者音乐（可能也是不被一些视频网站所使用的原因。）这里先不表。但是实测安卓uc浏览器打开小新的博客是可以听音乐的(可能点击播放的话他不显示，但是是会播放的！）。可是虾米的网页音乐播放器小新手机是放不了的。
使用的话代码也简单：<audio src="地址.mp3" controls="controls" name="media"/></audio>
播放器展示：
如果对视频播放器感兴趣，可以点击直达，到一个英文的网站了解一下！
第二款是来自法国的一款很简洁的Flash音乐播放器，有点小清新，外观还是不错的。目前拥有七款不同的样式，比如“迷你”、“经典”、“带歌曲列表”等。你可以直接调用，但是小新是不推荐的，因为需要远程调用它的swf样式，这样对于博客速度不好。所以小新推荐下载它的样式文件，本地调用更好点。注意这款播放器只支持mp3(估计别的也不常用)
1、Mini代码（dewplayer-mini.swf替换成成自己的地址)：
<object type="application/x-shockwave-flash" data="dewplayer-mini.swf?mp3=MP3地址" width="160" height="20" id="dewplayer-mini"><param name="wmode" value="transparent"/><param name="movie" value="dewplayer-mini.swf?mp3=MP3地址"/></object>
Mini样式展示：
2、Classic代码（dewplayer-mini.swf替换成成自己的地址)：
<object type="application/x-shockwave-flash" data="dewplayer.swf?mp3=MP3地址" width="200" height="20" id="dewplayer"><param name="wmode" value="transparent"/><param name="movie" value="dewplayer.swf?mp3=MP3地址"/></object>
Classic样式展示：
3、Multi代码（dewplayer-multi.swf替换成成自己的地址)：
<object type="application/x-shockwave-flash" data="dewplayer-multi.swf?mp3=mp3地址" width="240" height="20" id="dewplayer-multi"><param name="wmode" value="transparent"/><param name="movie" value="dewplayer-multi.swf?mp3=mp3地址"/></object>
Multi样式展示：
4、Multi Rect代码（dewplayer-rect.swf替换成成自己的地址)：
<object type="application/x-shockwave-flash" data="dewplayer-rect.swf?mp3=mp3地址" width="240" height="20" id="dewplayer-rect"><param name="wmode" value="transparent"/><param name="movie" value="dewplayer-rect.swf?mp3=mp3地址"/></object>
Multi Rect样式展示：
至于余下的三款样式就不一一展示了，因为带播放列表的还要再编辑playlist.xml文件，比较繁琐，实际上如果真要带播放列表可以直接使用虾米播放器，也就不需要自己制作的了！
如果需要更详细的信息或者使用方法，可以做传送阵到它的官网查看，它里面可以自助选择各种样式生成代码。因为是法文，看不懂请自备翻译。
如果需要更详细的信息或者使用方法，可以做传送阵到它的官网查看，它里面可以自助选择各种样式生成代码。因为是法文，看不懂请自备翻译。
这一款播放器我挺喜欢的，不占地方是一个，点击播放才拉出进度条，停止又缩回去。它有一个插件版：
不喜欢插件，可以直接使用代码。但是需要下载player.swf文件(点击下载)，然后上传到 wp-content/theme/主题目录下，再到主题的 functions.php 中间位置 添加如下函数：
/**添加 flash player */
function myplayer($atts, $content=null){
extract(shortcode_atts(array("auto"=>'no',"loop"=>'no'),$atts));
return '<embed src="'.get_bloginfo("template_url").'/player.swf?soundFile='.$content.'&bg=0xeeeeee&leftbg=0x357dce&lefticon=0xFFFFFF&rightbg=0xf06a51&rightbghover=0xaf2910&righticon=0xFFFFFF&righticonhover=0xffffff&text=0x666666&slider=0x666666&track=0xFFFFFF&border=0x666666&loader=0x9FFFB8&loop='.$loop.'&autostart='.$auto.'" type="application/x-shockwave-flash" wmode="transparent" allowscriptaccess="always" width="290" height="30">';
}
add_shortcode('music','myplayer');
/**
然后需要播放器时，可以直接编辑代码：[mu sic]MP3地址[/mu sic] 调用去掉空格！
Audio Player样式展示：[music]http://sc.111ttt.com/up/mp3/322714/6CD51207A9438E018AA7FF50494FA9E2.mp3[/music]
当然，这个代码的使用是转自Dream Catcher，它的颜色是可以修改的，上面说的只是插件的代码版，实际上它还有一种直接使用代码调用是需要7行代码，需要调用两个样式，不过并不需要修改主题文件。代码如下：
<script language="JavaScript" src="https://img.xkfree.com/wp-content/files/audio-player.js"></script>
<object type="application/x-shockwave-flash" data="https://www.xkfree.com/wp-content/files/player.swf" id="audioplayer1" height="24" width="290">
<param name="movie" value="https://www.xkfree.com/wp-content/files/player.swf">
<param name="FlashVars" value="playerid=audioplayer1&soundFile=mp3地址">
<param name="quality" value="high">
<param name="menu" value="false">
<param name="wmode" value="transparent">
</object>
<object type="application/x-shockwave-flash" data="https://www.xkfree.com/wp-content/files/player.swf" id="audioplayer1" height="24" width="290">
<param name="movie" value="https://www.xkfree.com/wp-content/files/player.swf">
<param name="FlashVars" value="playerid=audioplayer1&soundFile=mp3地址">
<param name="quality" value="high">
<param name="menu" value="false">
<param name="wmode" value="transparent">
</object>
外观展示：
不知不觉就写了这样，可能大家会觉得眼花吧。。。从晚上八点多写到现在，半夜12点半了。小新基本是个代码盲，所以大家可以从上面的代码中简化一下也许也可以。咱们插个音乐也不过是为了方便嘛。呵呵，不说了。有时间再补个图。睡觉去,晚安！
评论（40）