PHP+CKEditor 3配置详细说明(包括图片上传)
首先，我们要在页面中加入CKEditor的js文件：
<head>
...
<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
</head>
其次，在你要插入编辑器的地方插入如下代码：
<textarea name="editor">文本的默认HTML代码</textarea>
其中，"editor"是以后你要传给后台脚本语言的post名，也是js要用到的名称。然后，在该页的最底下插入：
<script type="text/javascript">
CKEDITOR.replace( 'editor');
</script>
上面这段js代码要在你的页面载入完成后插入，你也可以把它放在windows.onload中。
这样，测试一下，一个简单的编辑器就完成了。
接下来，我们要对我们的编辑器做一配置，配置的方式有很多，为了方便起见，我选择了目录下的config.js文件来进行配置。很多的配置我们都可以使用 默认值，在这里，常用的配置如下，如果你想了解全部的配置信息，可以到这里来查看，也可以到CKEditor的官方网站看文档。
//界面的语言配置 设置为'zh-cn'即可
config.defaultLanguage = 'en';
//默认的字体名 plugins/font/plugin.js
config.font_defaultLabel = 'Arial';
//字体编辑时的字符集 可以添加常用的中文字符：宋体、楷体、黑体等 plugins/font/plugin.js
config.font_names = 'Arial;Times New Roman;Verdana';
//字体编辑时可选的字体大小 plugins/font/plugin.js
config.fontSize_sizes ='8/8px;9/9px;10/10px;11/11px;12/12px;14/14px;16/16px;18/18px;20/20px;22/22px;24/24px;26/26px;28/28px;36/36px;48/48px;72/72px'
//编辑器的高度
config.height = 200
//界面的现实语言 可选择"zh-cn"
config.language = true
//可选界面包
config.skin = 'default';
//使用的工具栏 plugins/toolbar/plugin.js 当然你也可以使用自己的工具栏
config.toolbar = ‘Full'
这将配合：
config.toolbar_Full =
[
['Source','-','Save','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print', 'SpellChecker', 'Scayt'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'],
'/',
['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
['Link','Unlink','Anchor'],
['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
'/',
['Styles','Format','Font','FontSize'],
['TextColor','BGColor']
];
config.toolbar = 'Buaa'; //选择界面功能
//定义界面工具
config.toolbar_Buaa =
[
['Source','-','Save','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print', 'SpellChecker', 'Scayt'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'],
'/',
['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
['Link','Unlink','Anchor'],
['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
'/',
['Styles','Format','Font','FontSize'],
['TextColor','BGColor']
];
//编辑器的宽度 plugins/undo/plugin.js
config.width = ""
图片上传
CKEditor的原包中没有包含图片的上传服务器端处理文件，其公司的另一款开源产品：CKFinder做了很好的补充。但是要下载这个源代码再进行配 置，虽然方便了很多，但是仅仅为了上传图片，却要使用这么大的整个系统来使用，确实有点大材小用，我花了一个下午的时间，自己用PHP脚本写了一个处理上 传文件的脚本代码，没有做更多的安全处理，希望对大家有用。
首先，在你的config.js文件里添加如下代码：
CKEDITOR.editorConfig = function( config )
{
config.filebrowserImageUploadUrl = './upload.php?type=img';
config.filebrowserFlashUploadUrl = './upload.php?type=flash';
};
以上的配置是上传要处理到的文件的地址，你可以根据自己情况进行修改。upload.php文件如下：
<?php
/*
CKEditor_upload.php
monkee
2009-11-15 16:47
*/
$config=array();
$config['type']=array("flash","img"); //上传允许type值
$config['img']=array("jpg","bmp","gif"); //img允许后缀
$config['flash']=array("flv","swf"); //flash允许后缀
$config['flash_size']=200; //上传flash大小上限 单位：KB
$config['img_size']=500; //上传img大小上限 单位：KB
$config['message']="上传成功"; //上传成功后显示的消息，若为空则不显示
$config['name']=mktime(); //上传后的文件命名规则 这里以unix时间戳来命名
$config['flash_dir']="/ckeditor/upload/flash"; //上传flash文件地址 采用绝对地址 方便upload.php文件放在站内的任何位置 后面不加"/"
$config['img_dir']="/ckeditor/upload/img"; //上传img文件地址 采用绝对地址 采用绝对地址 方便upload.php文件放在站内的任何位置 后面不加"/"
$config['site_url']=""; //网站的网址 这与图片上传后的地址有关 最后不加"/" 可留空
//文件上传
uploadfile();
function uploadfile()
{
global $config;
//判断是否是非法调用
if(empty($_GET['CKEditorFuncNum']))
mkhtml(1,"","错误的功能调用请求");
$fn=$_GET['CKEditorFuncNum'];
if(!in_array($_GET['type'],$config['type']))
mkhtml(1,"","错误的文件调用请求");
$type=$_GET['type'];
if(is_uploaded_file($_FILES['upload']['tmp_name']))
{
//判断上传文件是否允许
$filearr=pathinfo($_FILES['upload']['name']);
$filetype=$filearr["extension"];
if(!in_array($filetype,$config[$type]))
mkhtml($fn,"","错误的文件类型！");
//判断文件大小是否符合要求
if($_FILES['upload']['size']>$config[$type."_size"]*1024)
mkhtml($fn,"","上传的文件不能超过".$config[$type."_size"]."KB！");
//$filearr=explode(".",$_FILES['upload']['name']);
//$filetype=$filearr[count($filearr)-1];
$file_abso=$config[$type."_dir"]."/".$config['name'].".".$filetype;
$file_host=$_SERVER['DOCUMENT_ROOT'].$file_abso;
if(move_uploaded_file($_FILES['upload']['tmp_name'],$file_host))
{
mkhtml($fn,$config['site_url'].$file_abso,$config['message']);
}
else
{
mkhtml($fn,"","文件上传失败，请检查上传目录设置和目录读写权限");
}
}
}
//输出js调用
function mkhtml($fn,$fileurl,$message)
{
$str='<script type="text/javascript">window.parent.CKEDITOR.tools.callFunction('.$fn.', \''.$fileurl.'\', \''.$message.'\');</script>';
exit($str);
}
?>
附上这个upload.php文件的下载地址：http://download.csdn.net/source/1795185