-----------------------------------------------------------------------------------------------
首先去UEditor官網下載所需對應版本:http://ueditor.baidu.com/website/download.html
這裡以1.4.2 PHP 版本,UTF-8版 為例=>
------------------------------@ chenwei 整合 <www.chenwei.ws>-----------------------
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
//工具欄上的所有的功能按鈕和下拉框,可以在new編輯器的實例時選擇自己需要的從新定義 , toolbars: [[ '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' ]]
2) 自定義編輯器寬高: ,initialFrameWidth:700 //初始化編輯器寬度,默認1000
,initialFrameHeight:350 //初始化編輯器高度,默認320
5. 修改PC_PATH/libs/classes/form.class.php文件,
將原來的:
if(!defined('EDITOR_INIT')) { $str = '<script type="text/javascript" src="'.JS_PATH.'ckeditor/ckeditor.js"></script>'; define('EDITOR_INIT', 1); }
改為:
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>';
6. 在ueditor/themes/default/css/ueditor.css中,
/*UI工具欄,編輯區域,底部樣式*/ 裡
增加一行: width:auto !important; //注:增加此行,使編輯器自適應
7. 去編輯器下方除子標題顯示:去掉phpcms/libs/classes/form.class.php中 如下代碼,
$ext_str = "<div class='editor_bottom'>"; if(!defined('IMAGES_INIT')) { $ext_str .= '<script type="text/javascript" src="'.JS_PATH.'swfupload/swf2ckeditor.js"></script>'; define('IMAGES_INIT', 1); } $ext_str .= "<div id='page_title_div'> <table cellpadding='0' cellspacing='1' border='0'><tr><td class='title'>".L('subtitle')."<span id='msg_page_title_value'></span></td><td> <a class='close' href='javascript:;' onclick='javascript:$(\"#page_title_div\").hide();'><span>×</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='".L('submit')."' onclick=insert_page_title(\"$textareaid\",1)></td></tr> </table></div>"; $ext_str .= "</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;
------------------------------------------------------------------------------------------------