CKEditor 4.2 只能增加flash播放格式,没有视频插件。
这个插件允许插入和编辑新的HTML5<video>元素。该对话框允许指定的海报图像,尺寸(他们是根据预览自动调整)和两个源文件,
这样既使用了WebM格式(Chrome浏览器,Firefox和Opera),并且只支持H264的那些浏览器(IE9和Safari浏览器)可以查看您的视频。
安装步骤
1. 复制到CKEditor 下的"plugins"文件夹
2.然后配置 CKEditor的(config.js) 文件,加入下面的代码,意思是引入插件:
config.extraPlugins = 'video';
如果之前已经引入过其他插件,可以用逗号隔开,表示两个插件
config.extraPlugins = 'fmath_formula,video';
3.在toolbar 配置中,加入“Video” 项(注意:V要dax),例如:
config.toolbar = [ { name: 'tools', items: ['Maximize', 'ShowBlocks','Source' ] }, { name: 'document', groups: [ 'mode', 'document', 'doctools' ], items: [ 'Save', 'NewPage', 'Preview', 'Print', '-', 'Templates' ] }, { name: 'forms', items: [ 'TextField','Select' ] }, { name: 'insert', items: [ 'Image', 'Flash','Video', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'PageBreak','fmath_formula' ] } ];
更多信息,查看doc下的install.doc文件。
【修改bug】
之前版本,可以成功添加video,也可以保存到服务器,但是编辑的时候,video和source里面的属性就不翼而飞了,如果再次点保存,得到的结果就是“你的浏览器不支持此播放器.<br>请直接下载文件”。
【修订代码】
修改videoplugin.js
原来:
editor.addCommand( 'Video', new CKEDITOR.dialogCommand( 'video') );修改为
//包含属性的标签,也可以增加自定义属性。 var b = "video[controls,id,height,poster,width];source[src,type]"; editor.addCommand( 'Video', new CKEDITOR.dialogCommand( 'video', { allowedContent: b,//允许的内容 requiredContent: "video" } ) );
顺便汉化了一下,现在有一个遗憾,就是没加上传代码。