phpcmsV9.5.8整合百度编辑器Ueditor1.4.3教程

最近在搞phpcms视频功能，官方的视频功能实在是坑，刚开始是想将优酷的上传功能集成到ckeditor，在coding上有个项目，上传已经集成好了，还没有做上传后视频的获取和显示

项目地址：https://coding.net/savokiss/melos.git

这个项目是可以在线演示的，有兴趣的同学可以私信我或者fork一下

今天偶然看到了百度的ueditor，看了一下有视频上传功能，可以满足小规模视频需求，所以就开始搞了，

网上看了很多教程有个别的缺点，不太适用于最新版v9，所以自己整理了一下：修改前注意备份

1. 下载Ueditor

官网：http://ueditor.baidu.com/website/download.html

2.解压到phpcms目录

将压缩包内文件夹改名为ueditor解压到phpcms目录下面的./statics/js/下，目录结构如下：

3.修改ueditor/php/config.json

全局替换，

- 如果是本地项目，将/ueditor/php/upload/替换为/网站文件夹/uploadfile/

- 如果是线上项目，将/ueditor/php/upload/替换为/uploadfile/

4.修改./libs/classes/form.class.php文件

将静态方法editor里面所有内容替换为：

$str =\'\';
if(!defined(\'EDITOR_INIT\')) {
            $str .= \'<script type="text/javascript" src="\'.JS_PATH.\'ueditor/ueditor.config.js"></script>\';
            $str .= \'<script type="text/javascript" src="\'.JS_PATH.\'ueditor/ueditor.all.js"></script>\';
            $str .= \'<script type="text/javascript" src="\'.JS_PATH.\'ueditor/ueditor.parse.js"></script>\';
            $str .= \'<link rel="stylesheet" href="\'.JS_PATH.\'ueditor/themes/default/css/ueditor.css"/>\';
            define(\'EDITOR_INIT\', 1);
        }
            $str .= "<script type=\"text/javascript\">\r\n";
            $str .= "var editor = UE.getEditor(\'$textareaid\');";
            $str .= \'</script>\';
return $str;

5.修改ueditor大小

在ueditor/themes/default/css/ueditor.css中，

找到/*UI工具栏、编辑区域、底部*/下面的css：.edui-default .edui-editor，在其中添加：

width:auto!important;//用于ueditor工具栏的宽度自适应

往下找到edui-editor-iframeholder，在其中也添加：

width:auto!important;//用于ueditor内容框宽度自适应

6.修改ueditor宽度

在ueditor/ueditor.config.js中，

找到initialFrameHeight，将此行注释取消掉（默认的高度比较低）

注意：

1.如果需要自定义工具栏：

修改ueditor/ueditor.config.js配置文件，

,toorbars : [[ ********** ]]

这个工具栏图标你可以参照官方文档进行修改，去掉不需要的功能：http://fex.baidu.com/ueditor/#start-toolbar

2.附件没有按照phpcms的命名规则修改，

如果需要修改，在config.json文件中：

按如下替换：注意涉及到image,file,video，需要替换三次

uploadfile/{yyyy}/{mm}{dd}/{yyyy}{mm}{dd}{rand:6}

3.phpcms自带的ckeditor是上传附件的时候是操作数据库的，

所以后台附件管理有数据库模式，而咱没有写相关代码，所以如果需要管理附件只能用目录模式进行删除，这种情况下也就不需要注意路径问题了

4.本方法是在新安装的phpcms v9.5.8上面完成的，所以没有考虑已有附件在ueditor中的显示问题

如果是已存在的附件，需要替换如下图三个文件中的一些路径：

具体可以参考下帖对这三个文件的操作部分：http://bbs.phpcms.cn/thread-882637-1-1.html

5.关于上传的视频在IE下看不到的问题（2014.11.6更新）

参考这篇文章：http://blog.csdn.net/estelle_belle/article/details/40047443

在视频播放的页面或者header引入如下代码即可

<!--[if IE]>
<script src="http://api.html5media.info/1.1.4/html5media.min.js"></script>  
<![endif]-->

上述方法改过之后暂时没有发现问题，如果有问题随时更新，欢迎交流！

秒客网

phpcmsV9.5.8整合百度编辑器Ueditor1.4.3教程

相关文章