CKEditor+CKFinder for java实例教程。CKEditor 、CKFinder 相互融合要注意的细节的确很多，因为功能的强大和界面的优势，花费一些时间整合还是有意义的。

下载插件：
CKEditor ： http://ckeditor.com/
CKFinder ：http://ckfinder.com

分别解压后，添加到项目中，复制CKFinder lib 下面的所有jar 到项目的lib 目录
1. CKFinder 下面有一个config.xml 文件 复制到 项目中 最好放在WEB-INF下面
config.xml：
<config>
<enabled>true</enabled>
<baseDir></baseDir>
<baseURL>/CkeditorForJava/userfiles/</baseURL>
<licenseKey></licenseKey>
<licenseName></licenseName>
<imgWidth>1600</imgWidth>
<imgHeight>1200</imgHeight>
<imgQuality>80</imgQuality>
<uriEncoding>UTF-8</uriEncoding>
<forceASCII>false</forceASCII>
<disallowUnsafeCharacters>false</disallowUnsafeCharacters>
<userRoleSessionVar>CKFinder_UserRole</userRoleSessionVar>
<checkDoubleExtension>true</checkDoubleExtension>
<checkSizeAfterScaling>true</checkSizeAfterScaling>
<secureImageUploads>true</secureImageUploads>
<htmlExtensions>html,htm,xml,js</htmlExtensions>
<hideFolders>
<folder>.svn</folder>
<folder>CVS</folder>
</hideFolders>
<hideFiles>
<file>.*</file>
</hideFiles>
<defaultResourceTypes></defaultResourceTypes>
<types>
<type name=”Files”>
<url>�SE_URL%files/</url>
<directory>�SE_DIR%files</directory>
<maxSize>0</maxSize>
<allowedExtensions>7z,aiff,asf,avi,bmp,csv,doc,docx,fla,flv,gif,gz,gzip,jpeg,jpg,mid,mov,mp3,mp4,mpc,mpeg,mpg,ods,odt,pdf,png,ppt,pptx,pxd,qt,ram,rar,rm,rmi,rmvb,rtf,sdc,sitd,swf,sxc,sxw,tar,tgz,tif,tiff,txt,vsd,wav,wma,wmv,xls,xlsx,zip
</allowedExtensions>
<deniedExtensions></deniedExtensions>
</type>
<type name=”Images”>
<url>�SE_URL%images/</url>
<directory>�SE_DIR%images</directory>
<maxSize>0</maxSize>
<allowedExtensions>bmp,gif,jpeg,jpg,png</allowedExtensions>
<deniedExtensions></deniedExtensions>
</type>
<type name=”Flash”>
<url>�SE_URL%flash/</url>
<directory>�SE_DIR%flash</directory>
<maxSize>0</maxSize>
<allowedExtensions>swf,flv</allowedExtensions>
<deniedExtensions></deniedExtensions>
</type>
</types>
<accessControls>
<accessControl>
<role>*</role>
<resourceType>*</resourceType>
<folder>/</folder>
<folderView>true</folderView>
<folderCreate>true</folderCreate>
<folderRename>true</folderRename>
<folderDelete>true</folderDelete>
<fileView>true</fileView>
<fileUpload>true</fileUpload>
<fileRename>true</fileRename>
<fileDelete>true</fileDelete>
</accessControl>
</accessControls>
<thumbs>
<enabled>true</enabled>
<url>�SE_URL%_thumbs/</url>
<directory>�SE_DIR%_thumbs</directory>
<directAccess>false</directAccess>
<maxHeight>100</maxHeight>
<maxWidth>100</maxWidth>
<quality>80</quality>
</thumbs>
<plugins>
<plugin>
<name>imageresize</name>
<class>com.ckfinder.connector.plugins.ImageResize</class>
<params>
<param name=”smallThumb” value=”90×90″></param>
<param name=”mediumThumb” value=”120×120″></param>
<param name=”largeThumb” value=”180×180″></param>
</params>
</plugin>
<plugin>
<name>fileeditor</name>
<class>com.ckfinder.connector.plugins.FileEditor</class>
<params></params>
</plugin>
</plugins>
<basePathBuilderImpl>com.ckfinder.connector.configuration.ConfigurationPathBuilder</basePathBuilderImpl>
</config>
上面的其他配置可以根据自己的需要去修改

2. 修改ckeditor 下面的comfig.js文件 （以下是主要的代码） 注意下面添加行距标签的地方

config.filebrowserBrowseUrl = ‘../ckfinder/ckfinder.html’;
config.filebrowserImageBrowseUrl = ‘../ckfinder/ckfinder.html?type=Images’;
config.filebrowserFlashBrowseUrl = ‘../ckfinder/ckfinder.html?type=Flash’;
config.filebrowserUploadUrl = ‘/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Files’;
config.filebrowserImageUploadUrl = ‘/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Images’;
config.filebrowserFlashUploadUrl = ‘/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Flash’ ;

config.language = ‘zh-cn’; // 配置语言
config.uiColor = ‘#FFF’; // 背景颜色
config.image_previewText=”; //预览区域显示内容
// config.width = ‘auto’; // 宽度
config.height = ’500px’; // 高度
config.skin = ‘office2003′;//界面v2,kama,office2003
config.toolbar = ‘Full’;// 工具栏风格Full,Basic
config.extraPlugins += (config.extraPlugins ? ‘,lineheight’ : ‘lineheight’);

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','lineheight'],
['TextColor','BGColor'],
['Maximize', 'ShowBlocks','-','About']
];

config.toolbar_Basic =
[
['Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink','-','About']
];

3.页面的设置
<1>
头部加入：