PHPCMS V9整合百度UEditor编辑器操作详解

最近的一个项目使用PHPCMS，而自带的ckeditor编辑器一点都不好用，于是就整合百度UEditor。支持图片批量上传,上传附件等功能，自己整理一下步骤如下，修改前请先备份。

1、下载Ueditor

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

2、上传ueditor到phpcms目录

将压缩包解压后改名为ueditor，上传到网站/statics/js/目录下，

3、修改文件上传路径

修改ueditor/php/config.json文件，全局替换（共 8处）
– 如果是本地项目，将/ueditor/php/upload/ 替换为 /网站文件夹/uploadfile/
– 如果是线上项目，将/ueditor/php/upload/ 替换为 /uploadfile/

4、修改phpcms默认编辑器ckeditor为Ueditor

修改/phpcms/libs/classes/form.class.php文件，把编辑器调用方法editor{}里面所有内容替换为：

1. $str ='';
2. if(!defined('EDITOR_INIT')) {
3. $str .= '';
4. $str .= '';
5. $str .= '';
6. $str .= '.JS_PATH.'ueditor/themes/default/css/ueditor.css"/>';
7. define('EDITOR_INIT', 1);
8. }
9. $str .= "';
10. 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配置文件，toolbars: [[]]数组
这个工具栏图标你可以参照官方文档进行修改，去掉不需要的功能：http://fex.baidu.com/ueditor/#start-toolbar

2.上传的文件&图片没有按照phpcms的命名规则，如果需要修改ueditor/php/config.json文件：
上传图片、抓取远程图片 、上传视频，为/uploadfile/{yyyy}/{mm}{dd}/{yyyy}{mm}{dd}{rand:6}，

不过本人喜欢按月份建立目录，如下：上传图片配置项 imagePathFormat： /uploadfile/{yyyy}{mm}/{yyyy}{mm}{dd}{rand:4} ，同时修改/phpcms/libs/classes/attachment.class.php 文件，第47行左右的缩略图和多图片上传路径设置为
$this->savepath = $this->upload_root.$this->upload_dir.date('Ym/');

列出指定目录下的图片 imageManagerListPath ，/uploadfile/
列出指定目录下的文件 fileManagerListPath ，/uploadfile/file/

3.phpcms自带的ckeditor是上传附件的时候是操作数据库的，所以后台附件管理有数据库模式，而咱没有写相关代码，所以如果需要管理附件只能用目录模式进行删除，这种情况下也就不需要注意路径问题了

4、如果需要修改编辑器里内容的样式，需要修改ueditor/themes/iframe.css文件。