FCKeditor php配置步骤详细介绍

最近项目中要用到文本编辑器,经比较,决定使用FCKeditor和kindeditor,下面是总结的FCKeditor的详细配置步骤,PHP环境.希望第一次使用此编辑器的朋友得到全面完整的参考:

一. 将fckeditor文件夹复制到网站后台目录(如administrator)中.

二. 在PHP页面表单中需添加文本域的位置插入:

<?php
include('fckeditor/fckeditor.php');
$oFCKeditor = new FCKeditor('articleContent') ;  //配置文本框的name属性
$oFCKeditor->BasePath = 'fckeditor/';   //将fckeditor文件夹的路径放在这里,注意,后边一定要加一个"/".
$oFCKeditor->Value = ''; //配置多行文本框里边的内容
$oFCKeditor->Height = '300px'; //设置高
$oFCKeditor->Width = '90%';  //设置宽 px % 都可以
$oFCKeditor->Create();
?>

三. 配置上传图片的保存目录:

打开fckeditor\editor\filemanager\connectors\php\config.php ，在该文件里找到

$Config['Enabled'] = true ; //此处由false改为true 开启上传功能

$Config['UserFilesPath'] = '/upload/' ; //图片上传到网站根目录下的upload文件夹内(如本地测试,则需在upload目录前加项目名称,如 '/simsite/upload/')

四. 上传文件重命名:

打开fckeditor\editor\filemanager\connectors\php\commands.php ，在该文件里找到

$sExtension = strtolower( $sExtension ) ;

在其后添加:

$sFileName = time().".".$sExtension; //重命名文件

五. 限制上传图片字节大小

打开fckeditor\editor\filemanager\connectors\php\config.php ，在该文件里找到

$Config['DeniedExtensions']['Image'] = array() ;

在其后添加:

$Config['MaxImageSize'] = '500'; //设置允许上传的图片大小在500k以内

打开 fckeditor\editor\filemanager\connectors\php\commands.php 第291行,在其上添加如下语句:

if(isset($Config['MaxImageSize'])){
    $iFileSize=round($oFile['size']/1024);
    if($iFileSize>$Config['MaxImageSize']){
        $sErrorNumber='204' ;
    }
}

打开fckeditor/editor/dialog/fck_image/fck_image.js 在 switch(errorNumber) 结构中添加如下错误提示信息:

case 204 :
 alert( "请上传500K以内的图片!" ) ;
break ;
 
六. 上传图片提示信息汉化

打开fckeditor/editor/dialog/fck_image/fck_image.js 第454行，将 switch(errorNumber) 结构中错误提示信息按如下修改:

switch(errorNumber){
    case 0:    // No errors
        alert('图片上传成功!');
    break;
    case 1:    // Custom error
        alert(customMsg);
    break;
    case 101:    // Custom warning
        alert(customMsg);
    break;
    case 204:
        alert('请上传500K以内的图片!');
    break;
    case 201:
        alert('已存在同名文件.刚才上传的文件已自动重命名为: "' + fileName + '"');
    break;
    case 202:
        alert('不支持此文件格式!');
    break;
    case 203:
        alert('您可能没有足够的权限上传文件,请检查服务器设置!');
    break;
    case 500:
        alert('连接被禁用!');
    break;
    default:
        alert('文件上传失败.错误号: ' + errorNumber);
    break;
}

在该文件里面找到 “Please select a file to upload”，将其替换为 “请选择要上传的文件” 。

七. 添加中文字体与字号设置

在编辑器的根目录中找到并打开 fckconfig.js 文件，找到如下两行代码：

FCKConfig.FontNames     = 'Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;
FCKConfig.FontSizes     = 'smaller;larger;xx-small;x-small;small;medium;large;x-large;xx-large' ;

将其注释掉并添加如下代码:

// 中文字体
FCKConfig.FontNames = '宋体;新宋体;黑体;微软雅黑;隶书;幼圆;楷体_GB2312;仿宋_GB2312;方正舒体;方正姚体;华文隶书;华文新魏;华文行楷;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;
// 按文字像素大小选择:
FCKConfig.FontSizes = '9px;10px;12px;14px;16px;18px;20px;22px;24px;36px' ;

经过以上设置，Fckeditor 就已经被我们打造成了一个非常个性的文本内容编辑器了。