WordPress播放器Html5视频插件:MediaElement.js – HTML5 Video & Audio Player

微饭网官方微信
HTML5 Video

Mediaelement.js是一款HTML5视频和Flash兼容的音频播放器,支持IE,FirefoxOperaSafariChrome和iPhoneipad、Andriod等移动端。支持MP4,OGG,MP3,WMV,WebM,WAV,WMA文件格式以及与websrt文件标题。

插件后台搜索:media-element-html5-video-and-audio-player

http://221.228.249.17/4/z/v/f/p/zvfptuhcqgfcrfzdiydzqwbejqhilo/he.yinyuetai.com/A5170139C2D37E37F0155DE863AC0A5C.flv?sc=11b18f95f96d3e01&br=3132&ptp=mv&rd=yinyuetai.com

使用方法

注:以下短码为了防止转义,我都将“[”替换成“【”了,请各位使用的适合自行修改成“["

视频标准格式短代码

【video src="http://mysite.com/mymedia.mp4" width="640" height="360"]

音频标准格式短代码

【audio src="http://mysite.com/mymedia.mp3"]

短代码兼容解决办法

如果你有一个插件与mediaelement.js插件冲突也可以用以下短码来实现:

【mejsvideo src="http://mysite.com/mymedia.mp4" width="640" height="360"]
【mejsaudio src="http://mysite.com/mymedia.mp3"]

src

这个位置插入任何音频或视频文件的地址

【video src="http://mysite.com/mymedia.mp4"]

如果没有后缀,mediaelement.js插件也会自动寻找匹配的文件名(mymedia.mp4,mymedia.webm等)

【video src="http://mysite.com/mymedia"]

type

资源的媒体类型

【video src="http://mysite.com/mymedia?xyz" type="video/mp4"]

mp4

视频h.264/mp4源的位置

【video mp4="http://mysite.com/mymedia.mp4"]

 

mp3

音频mp3的位置

【audio mp3="http://mysite.com/mymedia.mp3"]

OGG

Ogg Theora的位置的视频源

【video ogg="http://mysite.com/mymedia.ogg"]

WebM

VP8 / WebM视频的位置

【video webm="http://mysite.com/mymedia.webm"]

loop

播完后重新播放

【video src="http://mysite.com/mymedia.mp4" loop="true"]

preload

在用户点击播放前进行预加载视频

【video preload="true"]

autoplay

自动播放视频。

【video autoplay="true"]

fullscreen

禁用全屏按钮

【video src="http://mysite.com/mymedia.mp4" fullscreen="false"]

duration

禁止输出时间

【video src="http://mysite.com/mymedia.mp4" duration="false"]

volume

禁止调整音量

【video src="http://mysite.com/mymedia.mp4" volume="false"]

progress

禁用进度条

【video src="http://mysite.com/mymedia.mp4" progress="false"]

captions

WebSRT 字幕的URL地址

【video src="http://mysite.com/mymedia.mp4" captions="http://mysite.com/mymedia.srt"]

 

All Attributes Video

视频所有属性启用

【video mp4="http://mysite.com/mymedia.mp4" ogg="http://mysite.com/mymedia.ogg" webm="http://mysite.com/mymedia.webm" poster="http://mysite.com/mymedia.png" preload="true" autoplay="true" width="640" height="264"]

All Attributes Audio

音频所有属性启用

【audio mp3="http://mysite.com/mymedia.mp3" ogg="http://mysite.com/mymedia.ogg" preload="true" autoplay="true"]

在模板中使用

你可以使用WordPress的短码在你的模板中实现

<?php echo do_shortcode('【video src="myvfile.mp4"]'); ?>

 

你妹啊,花了我半个小时的时间慢慢撸出来的啊,这作者写的介绍太详细了,简直是小白入门级教程,再不会使用的话,我也无话可说了,微饭纯手打!

发表评论
加载中...
  • 唐山雨总 2年前 (2016-11-15)

    好赞的插件,都好几年了,依然好用

  • 小白 2年前 (2016-01-16)

    大师,请问写文章时如何用啊

    查看对话
    • 微饭君 微饭 2年前 (2016-01-17) 官方

      在写文章的时候加入以上代码就是

  • duo 3年前 (2015-07-04)

    请问一下音悦台的T-ara那段视频的地址你是如何得到的?

    查看对话
    • 微饭君 微饭 3年前 (2015-07-05) 官方

      app.weeiy.com 在线解析

相关文章