PHPCMS v9.5.6整合UEditer1.4.2_PHP教程-php教程-PHP中文網

PHPCMS v9.5.6整合UEditer1.4.2_PHP教程

WBOY

發布： 2016-07-13 10:28:54

原創

1140 人瀏覽過

-----------------------------------------------------------------------------------------------

首先去UEditor官网下载所需对应版本：http://ueditor.baidu.com/website/download.html

这里以1.4.2 PHP 版本，UTF-8版为例=>

------------------------------@ chenwei 整合 -----------------------

1. 将所下载的程序包解压，得到程序包目录，将程序包目录更名为ueditor。

2. 将ueditor包放入PHPCMS_PATH/statics/js/中。（PHPCMS_PATH为phpcms的入口文件所在路径）

3. 修改ueditor/php/config.json，将上传图片配置项路径，涂鸦图片上传配置项路径，截图工具上传保存路径，抓取远程图片保存路径，上传视频保存路径，上传文件保存路径中： /ueditor/php/upload/image/{yyyy}{mm}{dd}/{time}{rand:6} 改为： /phpcms/uploadfile/{yyyy}/{mm}{dd}/{yyyy}{mm}{dd}{rand:6}，符合PHPCMS的路径规则。

　　指定要列出图片的目录和指定要列出文件的目录为：/phpcms/uploadfile/

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

　　1) 自定义工具栏内容： ,toorbars : [[ ********** ]]

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

<span>//</span><span>工具栏上的所有的功能按钮和下拉框，可以在new编辑器的实例时选择自己需要的从新定义</span>
   , toolbars:<span> [[
           </span>'fullscreen', 'source', '|', 'undo', 'redo', '|',
           'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', 'cleardoc', '|',
           'rowspacingtop', 'rowspacingbottom', 'lineheight', '|',
           'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|',
           'directionalityltr', 'directionalityrtl', 'indent', '|',
           'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
           'link', 'unlink','|',
           'simpleupload', 'insertimage', 'insertvideo', 'music', 'attachment', 'insertframe','pagebreak', 'template', 'background', '|',
           'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
           'inserttable', 'deletetable','preview', 'searchreplace', 'help', 'drafts'<span>
     ]]</span>

登入後複製

　　2) 自定义编辑器宽高： ,initialFrameWidth:700 　　//初始化编辑器宽度,默认1000

　　　　　　　　　　　　 ,initialFrameHeight:350　　//初始化编辑器高度,默认320

5. 修改PC_PATH/libs/classes/form.class.php文件，

　　将原来的：

<span>if</span>(!<span>defined</span>('EDITOR_INIT'<span>)) {
    </span><span>$str</span> = '<script type="text/javascript" src="'.JS_PATH.'ckeditor/ckeditor.js"></script>'<span>;
    </span><span>define</span>('EDITOR_INIT', 1<span>);
}</span>

登入後複製

　　改为：　　

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

登入後複製

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

　　/*UI工具栏，编辑区域，底部样式*/ 里

　　增加一行： width:auto !important; //注：增加此行，使编辑器自适应

7. 去编辑器下方除子标题显示：去掉phpcms/libs/classes/form.class.php中如下代码，

<span>$ext_str</span> = "<div class='editor_bottom'>"<span>;
　　</span><span>if</span>(!<span>defined</span>('IMAGES_INIT'<span>)) {
　　</span><span>$ext_str</span> .= '<script type="text/javascript" src="'.JS_PATH.'swfupload/swf2ckeditor.js"></script>'<span>;
　　</span><span>define</span>('IMAGES_INIT', 1<span>);
}
　　</span><span>$ext_str</span> .= "<span><div id='page_title_div'>
　　<table cellpadding='0' cellspacing='1' border='0'><tr><td class='title'></span>".L('subtitle')."<span><span id='msg_page_title_value'></span></td><td>
　　<a class='close' href='javascript:;' onclick='javascript:$(\"#page_title_div\").hide();'><span>&times;</span></a></td>
　　<tr><td colspan='2'><input name='page_title_value' id='page_title_value' class='input-text' value='' size='30'> <input type='button' class='button' value='</span>".L('submit')."' onclick=insert_page_title(\"<span>$textareaid</span><span>\",1)></td></tr>
　　</table></div></span>"<span>;
　　</span><span>$ext_str</span> .= "</div>";

登入後複製

8. 修改编辑器内的内容显示不靠边问题：

　　statics/js/ueditor/themes/default/css/ueditor.css

　　.edui-default .edui-editor-iframeholder {
　　　　position: relative;
　　　　width: auto !important; //新添加此行

9. 解决编辑器浮动在发布按钮上方的问题：

　　修改statics/css/zh-cn-system.css 下.fixed-bottom .fixed-but{}属性，添加z-index: 2000;

------------------------------------------------------------------------------------------------