php 编辑器 插入视频,苗景云的博客-PHPCMS V9编辑器中新增上传mp4视频(上传视频并插入HTML5的video标签)的功能...

由于PHPCMS v9默认的编辑器中上传的视频插入的是embed标签使用的是flash播放器，手机端无法播放，所以来改造下，让其上传视频并插入HTML5的video标签，这样电脑端的主流浏览器和手机端能都播放，当然也可以参考本文修改进而支持ckplayer、cuplayer等播放器。

修改步骤(为防止与其它按钮混淆和去除无用插件，这里去除了原编辑器中插入flash和视频的按钮)：

一、打开statics/js/ckeditor/config.js文件第16行，修改成如下代码：

config.extraPlugins = 'capture,video';

二、复制statics/js/ckeditor/plugins/目录下的flashplayer目录并修改目录名称为video，然后删除video目录下的player目录。

三、修改statics/js/ckeditor/plugins/video/目录下的plugin.js文件为如下代码：

CKEDITOR.plugins.add('video', {

init: function(editor) {

//plugin code goes here

var pluginName = 'video';

CKEDITOR.dialog.add('video', 　function(a) {

var b = a.config;

var　 escape　 = 　 function(value) {

return　 value;

};

return　 {

title: 　 '插入MP4视频',

resizable: 　CKEDITOR.DIALOG_RESIZE_BOTH,

minWidth: 350,

minHeight: 200,

contents: 　[{

id: 'info',

label: '常规',

accessKey: 'P',

elements: [{

type: 'hbox',

widths: ['80%', '20%'],

children: [{

id: 'src',

type: 'text',

label: '源文件'

}, {

type: 'button',

id: 'browse',

filebrowser: 'info:src',

hidden: true,

align: 'center',

label: '浏览服务器'

}]

}]

}, {

id: 'Upload',

hidden: true,

filebrowser: 'uploadButton',

label: '上传视频',

elements: [{

type: 'file',

id: 'upload',

label: '上传视频',

size: 38

}, {

type: 'fileButton',

id: 'uploadButton',

label: '上传到服务器上',

filebrowser: 'info:src',

'for': ['Upload', 'upload'] //'page_id', 'element_id'

}]

}],

onOk: 　 function() {

mysrc　 = 　this.getValueOf('info', 　'src');

html　 = 　''　 + 　escape(mysrc)　 + 　'';

a.insertHtml("您的浏览器版本过低，请先升级。");

},

onLoad: 　 function() {　　　　　　　　}

};

});

editor.addCommand(pluginName, new CKEDITOR.dialogCommand(pluginName));

editor.ui.addButton('video', {

label: '插入mp4视频',

command: pluginName,

icon: this.path + 'icon.png'

});

}

});

四、修改phpcms/libs/classes/form.class.php文件第33行为如下代码：

['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],['ShowBlocks'],['Image','Capture','video'],['Maximize'],

五、最后清除浏览器缓存就可以了。