1、概述
FCKeditor是目前最优秀的可见即可得网页编辑器之一，它采用JavaScript编写。具备功能强大、配置容易、跨浏览器、支持多种编程语 言、开源等特点。它非常流行，互联网上很容易找到相关技术文档，国内许多WEB项目和大型网站均采用了FCKeditor（如百度，阿里巴巴）。本文将通 过与 PHP相结合，从基本安装到高级的配置循序渐进介绍给广大PHPer。
FCKeditor官方网站：http://www.fckeditor.net/
FCKeditor Wiki：http://wiki.fckeditor.net/
2、下载FCKeditor
登录FCKeditor官方站（http://www.fckeditor.net），点击网站右上角“Download”链接。
注意：当点击“FCKeditor_2.4.3.zip”链接后，将跳转到sourceforge.net网站上自动下载。如果您当前使用Linux或Unix系统，可以点击“FCKeditor_2.4.3.tar.gz”链接下载.tar.gz格式的压缩包。
3、安装FCKeditor
解压“FCKeditor_2.4.3.zip”文档到您的网站目录下，我们先假定您存放FCKeditor和调用脚本存于同一个目录下。
fckeditor目录包含FCKeditor2.4.3程序文件。check.php用于处理表单数据。add_article.php和 add_article_js.html分别是PHP调用FCKeditor和JavaScript调用FCKeditor实例脚本文件。
3.1、用PHP调用FCKeditor
调用FCKeditor必须先载入FCKeditor类文件。具体代码如下。
PHP代码:
<?php
include("fckeditor/fckeditor.php") ; // 用于载入FCKeditor类文件
?>
接下来，我们需要创建FCKeditor实例、指定FCKeditor存放路径和创建（显示）编辑器等。具体代码如下所示（代码一般放在表单内）。
PHP代码:
<?php
$oFCKeditor = new FCKeditor('FCKeditor1') ; // 创建FCKeditor实例
$oFCKeditor->BasePath = './fckeditor/'; // 设置FCKeditor目录地址
$FCKeditor->Width='100%'; //设置显示宽度
$FCKeditor->Height='300px'; //设置显示高度的高度
$oFCKeditor->Create() ; // 创建编辑器
?>
下面是笔者创建好的实例代码，您可将代码保存为add_article.php
通过浏览里打开http://127.0.0.1/add_article.php 查看FCKeditor安装效果。
FCKeditor安装成功！
注意：如果您想将FCKeditor创建为HTML结果代码，以便于在模板引擎里面调用（如Smarty）可使用如下代码。
$output = $oFCKeditor->CreateHtml() ;
现在，您可通过POST方式获得编辑器的变量值。本例将表单的action设置为check.php，您可在check.php里使用代码
$fckeditorValue = $_POST['FCKeditor1'];
获得编辑器的变量值了。
FCKeditor安装成功了。但是，我们还可以通过更多设置来使FCKeditor更加灵活人性化。具体方法文本后面介绍。
FCKeditor常用设置FCKeditor已经安装成功了，也可以使用了。但是我们可以通过一些简单的设置使FCKeditor更加符合您的项目需求。
设置工具栏很简单，只需打开fckeditor目录下面的fckconfig.js文件，按CTRL+F搜索FCKConfig.ToolbarSets["Default"]代码，找到如下代码。
XML/HTML代码
['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],
'/',
['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
['OrderedList','UnorderedList','-','Outdent','Indent'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
['Link','Unlink','Anchor'],
['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
'/',
['Style','FontFormat','FontName','FontSize'],
['TextColor','BGColor'],
['FitWindow','-','About']
]
在默认情况下，FCKeditor会调用上面定义的所有工具栏按钮。大家可以根据自己的需求进行设置。表1对上面的配置选项功能说明进行汇总。
代码名称 |
功能 |
代码名称 |
功能 |
| Source |
源代码 |
DocProps |
页面属性 |
| - |
｜分隔符 |
Save |
保存 |
| NewPage |
新建 |
Preview |
预览 |
| Templates |
模板 |
Cut |
剪切 |
| Copy |
复制 |
Paste |
粘贴 |
| PasteText |
粘贴为无格式文本 |
PasteWord |
从MS Word粘贴 |
| Print |
打印 |
SpellCheck |
拼写检查 |
| Undo |
撤消 |
Redo |
重做 |
| Find |
查找 |
Replace |
替换 |
| SelectAll |
全选 |
RemoveFormat |
清除格式 |
| Form |
表单 |
Checkbox |
复选框 |
| Radio |
单选框 |
TextField |
单行文本 |
| Textarea |
多行文本 |
Select |
列表菜单 |
| Button |
按钮 |
ImageButton |
图像域 |
| HiddenField |
隐藏域 |
Bold |
加粗 |
| Italic |
倾斜 |
Underline |
下划线 |
| StrikeThrough |
删除线 |
Subscript |
下标 |
| Superscript |
上标 |
OrderedList |
插入／删除编号列表 |
| UnorderedList |
插入／删除项目列表 |
Outdent |
减少缩进 |
| Indent |
增加缩进 |
JustifyLeft |
左对齐 |
| JustifyCenter |
居中对齐 |
JustifyRight |
右对齐 |
| JustifyFull |
两端对齐 |
Link |
插入／编辑链接 |
| Unlink |
取消链接 |
Anchor |
插入／编辑锚点链接 |
| Image |
插入编辑图像 |
Flash |
插入／编辑Flash |
| Table |
插入／编辑表格 |
Rule |
插入水平线 |
| Smiley |
插入表情 |
SpecialChar |
插入特殊符号 |
| PageBreak |
插入分页 |
Style |
样式 |
| FontFormat |
格式 |
FontName |
字体 |
| FontSize |
大小 |
TextColor |
文本颜色 |
| BGColor |
背景颜色 |
FitWindow |
全屏编辑 |
| About |
关于Fuckeditor |
|
表1：工具栏配置选项功能进行汇总
配置上传
要使您的FCKeditor能够使用上传功能，您必须进行以下配制。
注意：FCKeditor不支持虚拟目录，您的路径设置都是针对网站根目录的绝对路径而言的。这点对于发布到远程网站目录的开发者极为不便，后面我们会对此进行讨论。
一、打开fckeditor\editor\filemanager\upload\php\config.php，找到代码$Config['Enabled']，将值设置为true。
二、接下来几行，设置$Config['UserFilesPath']，设置上传路径。
三、打开fckeditor\fckconfig.js文件，找到代码_FileBrowserLanguage，将值设置为php。接下来一行，把_QuickUploadLanguage值也设置为php。
配置文件浏览
一、打开fckeditor\editor\filemanager\browser\default\connectors\php\config.php
找到代码$Config['Enabled']，将值设置为true;
二、接下来几行，设置$Config['UserFilesPath']，设置浏览路径。
关于上传\文件浏览安全性问题
为了解决FCKeditor不支持虚拟目录问题，和FCKeditor文件上传的安全性考良。我们有必要在这里单论对此进行讨论。
打开fckeditor\editor\filemanager\upload\php\config.php，找 到$Config['UserFilesPath']代码，在此行代码之前定义变量$root_path = $_SERVER['PHP_SELF'];
重新设置$Config['UserFilesPath']变量的值，示例如下。
$Config['UserFilesPath'] = $root_path . '您想上传的目录名/' ;
打开fckeditor\editor\filemanager\browser\default\connectors\php \config.php，找到代码$Config['UserFilesPath'],在此行代码之前定义变量$root_path = $_SERVER['PHP_SELF'];
重新设置$Config['UserFilesPath']变量的值，示例如下。
$Config['UserFilesPath'] = $root_path . '您想浏览的目录名/'
至此，您的FCKeditor已解决不支持虚拟目录问题。接下来，我们介绍一种技巧配置只允许管理员才可以使用FCKeditor上传问题。
解决方法其实很简单，假如网站采用$_SESSION['admin_id']验证管理员的登录id，您只需将相关的脚本文件引入即可。然后使用下面的代码配置文件上传\浏览开关。
精简FCKeditor文件空间大小
FCKeditor目录下面包含有许多示例代码，文档等资源，在我们的WEB项目正式发布式前，这些文件不但没有任何意义，反而会占用相当大的空间。下面我们介绍如何删除这些文件。
一：删除所有以“_”开头的文件夹
二：删除fckeditor目录下面除fckconfig.js、fckeditor.js、fckeditor.php、 fckeditor_php4.php、fckeditor_php5.php、fckpackager.xml、fckstyles.xml、 fcktemplates.xml、editor目录以外的所有文件（即，只保留刚才提到的几个文件和一个目录）。
三：进入fckeditor\editor\filemanager\browser\default\connectors文件夹，只保留PHP文件夹和test.html文件。
四：进入fckeditor\editor\filemanager\upload文件夹，只保留PHP文件夹和test.html文件。
五：进入fckeditor\editor文件夹，这个目录下面是一些语言包文件。除保留_getfontformat.html、 _translationstatus.txt、en.js、zh.js、zh-cn.js外，其它语言包对国内项目来说意义不大，可以删除。
六：进入fckeditor\editor\skins文件夹，该文件夹保存FCKeditor文件，如果您不想用可以删除。
