一直以來都感覺到PHPCMS自帶的編輯器CKeditor不好用,編輯文章版面各種不方便
在百度了很多關(guān)于更換PHPCMS編輯器的方法,當(dāng)然在論壇里也搜索不少關(guān)于編輯器更換的帖子
由于我用PHPCMS是做的站群(全HTTPS環(huán)境下多套PHPCMS,每套PHPCMS下有建立了多個(gè)子站點(diǎn),同時(shí)通過PHPSSO和UC互通整合了DZ論壇,同步注冊(cè)登陸,這個(gè)有需要的可以單獨(dú)聯(lián)系我),也整合了遠(yuǎn)程附件插件,在編輯器中上傳圖片或文件也都是存儲(chǔ)到第三方存儲(chǔ)返回遠(yuǎn)程地址的,這也給我想更換編輯器帶來了一定難度,同時(shí)我還需要編輯器增加一個(gè)代碼高亮插件。
注意 : 哪些文件需要修改?
statics/js/ckeditor/config.js(先替換,后修改)(主要就是注釋掉部分php代碼)
phpcms/libs/classes/form.class.php(增加幾行php代碼)
statics/js/ckeditor/skins/moono-lisa/editor.css(增加幾行css代碼)
詳細(xì)步驟:
1、將statics/js/ckeditor目錄更名成ckeditor_bak(備份以便以后恢復(fù));
2、下載CKEditor 4.8.0 Full的壓縮包,
3、將zip壓縮包中的ckeditor目錄解壓到statics/js目錄下;
4、將第一步原編輯器目錄ckeditor_bak中的config.js文件復(fù)制并覆蓋到ckeditor目錄中;
5、接著修改覆蓋后的ckeditor/config.js,注釋掉以下幾行代碼
// config.language = 'fr'; 注釋此行
config.uiColor = '#f7f5f4';
config.width = '';
//config.removePlugins = 'elementspath,scayt'; 注釋此行
//config.disableNativeSpellChecker = false; 注釋此行
//config.resize_dir = 'vertical'; 注釋此行
config.keystrokes =[[ CKEDITOR.CTRL + 13 /*Enter*/, 'maximize' ]];
//config.extraPlugins = 'capture,videoforpc,flashplayer'; 注釋此行
//config.enterMode = CKEDITOR.ENTER_BR; 注釋此行
//config.shiftEnterMode = CKEDITOR.ENTER_P; 注釋此行
config.font_names='宋體/宋體;黑體/黑體;仿宋/仿宋_GB2312;楷體/楷體_GB2312;隸書/隸書;幼圓/幼圓;微軟雅黑/微軟雅黑;'+ config.font_names;
6、修改phpcms/libs/classes/form.class.php,找到如下代碼,大約第70行左右
$str .= '</script>'
在此行后增加以下代碼:
$str .= '<div class="cke_footer">';
if($show_page == 'true') $str .= '<a href=\'javascript:insert_page("'.$textareaid.'")\'>分頁(yè)符</a><a href=\'javascript:insert_page_title("'.$textareaid.'")\'>子標(biāo)題</a>';
if($allowupload) $str .= '<a href="javascript:void(0);" onclick="flashupload(\'flashupload\', \'附件上傳\',\''.$textareaid.'\',\'\',\''.$allowuploadnum.','.$alowuploadexts.','.$allowbrowser.'\',\''.$module.'\',\''.$catid.'\',\''.$authkey.'\');return false;">附件上傳</a>'; $str .= '</div>';
7、復(fù)制以下CSS代碼到statics/js/ckeditor/skins/moono-lisa/editor.css文件的最后面:
.cke_footer{ float:left; margin-top:3px}
.cke_footer a,.cke_footer a:hover, .cke_footer a:visited, .cke_footer a:active{display:block; float:left;border:1px solid #e0e0e0; margin-right:8px;height:19px;line-height:19px;padding:0 10px;color:#666;cursor: hand;!important;cursor: pointer}
.cke_footer a:hover{background-position: left top}
.editor_bottom{ position:relative; height:1px; clear:both}
#page_title_div{width:295px; height:78px;position:absolute;display:none; z-index:99999; top:-120px; left:18px}
#page_title_div table{border:2px solid #d5e0e6; background:#fff;width:295px; height:78px;}
#page_title_div table td{ border:none}#page_title_div table td.title{text-align:left;height:26px;*height:25px;font:18px/31px "MicroSoft YaHei","SimHei";color:#333;*line-height:25px; margin:0; padding:0 0 0 12px}
#page_title_div a.close span{ display:none}
#page_title_div a.close{background: url(images/cross.png) no-repeat left 3px; display:block; float:right; margin-right:10px; width:16px; height:16px;}
#page_title_div a.close:hover{background-position: left -46px}
.content_attr{ border:1px solid #CCC; padding:5px 8px; background:#FFC; margin-top:6px}
#Capture{color:#474747; font-size:12px; line-height:20px}
#Capture font{color:red}
#Capture a{color:#0075c0;display:inline-block;zoom:1;*display:inline; background:url(images/cdw.png) no-repeat; padding-left:20px; text-decoration:none}
#Capture a:hover{text-decoration: underline}
#Capture #CaptureDown {background-image:url(images/cd.png)}
8、完成修改。
清空瀏覽器緩存,重新打開phpcmsV9后臺(tái),進(jìn)入內(nèi)容編輯器頁(yè)面查看編輯器效果。