文章内容详情

phpcms自带的ckeditor编辑器换成KindEditor的方法


最近我在研究phpcms的编辑器,发现自带编辑器不是特备好用,我不太喜欢ckeditor,相对喜欢国产轻量级KindEditor一点,查找资料决定将其换掉,本地UTF-8测试成功,GBK未测,感兴趣的朋友可以试试......

现上张图看效果吧! 

将phpcms默认ckeditor编辑器换成KindEditor


具体做法如下:

首先,去kindeditor官网下载一个新的编辑器,解压后将其整个文件夹重命名为kindeditor,并复制到\statics\js\目录;

然后修改\phpcms\libs\classes\form.class.php

查找

if(!defined('EDITOR_INIT')) {


如果你没修改过这个文件的话在第18行,

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


替换为

$str .= '<script charset="utf-8" type="text/javascript" src="'.JS_PATH.'kindeditor/kindeditor-min.js"></script>';
$str .= '<script charset="utf-8" type="text/javascript" src="'.JS_PATH.'kindeditor/lang/zh_CN.js"></script>';		
define('EDITOR_INIT', 1);			
$str .= "<script type=\"text/javascript\">\r\n";
$str .= "KindEditor.ready(function(K) {\r\n";
$str .= "editor = K.create('textarea[id=\"$textareaid\"]', {\r\n";
$str .= "allowFileManager : true,\r\n";	
$str .= "width : '99%',";
$str .= "height : '400px'";
$str .= "});";
$str .= "});";
$str .= '</script>';

保存,刷新,可以看到,编辑器已经换为KindEditor的了,但是测试发现,无法上传图片,附件等等!

下面需要做一些修改:

打开\statics\js\kindeditor\php\file_manager_json.php

将:

//根目录路径,可以指定绝对路径,比如 /var/www/attached/
$root_path = $php_path . '../attached/';
//根目录URL,可以指定绝对路径,比如 http://www.yoursite.com/attached/
$root_url = $php_url . '../attached/';

修改为phpcms的上传目录既可

//根目录路径,可以指定绝对路径,比如 /var/www/attached/
$root_path = $php_path . '../../../../uploadfile/';
//根目录URL,可以指定绝对路径,比如 http://www.yoursite.com/attached/
$root_url = $php_url . '../../../../uploadfile/';

同样将statics\js\kindeditor\php\upload_json.php中的

//文件保存目录路径
$save_path = $php_path . '../attached/';
//文件保存目录URL
$save_url = $php_url . '../attached/';
//定义允许上传的文件扩展名

修改为:

//文件保存目录路径
$save_path = $php_path . '../../../../uploadfile/';
//文件保存目录URL
$save_url = $php_url . '../../../../uploadfile/';
//定义允许上传的文件扩展名

将文章发布页面调整为全屏,个人喜好,无关紧要!可不修改!

将statics\css\zh-cn-system.css中的:

.addContent{width:960px; margin:0 auto; overflow:hidden;}

修改为:

.addContent{width:99%; margin:0 auto; overflow:hidden;}

好了,到此为止,基本上就与使用了,如果用什么觉得不美观的,可以自己试着进行修改!



      阿喀交