ckeditor4.5.11+ckfinder_java2.6.2配置
来源:互联网 发布:人工智能的英文作文 编辑:程序博客网 时间:2024/05/16 10:27
1、环境说明:
日期:2016-09-14
工具:ckeditor_4.5.11+ckfinder_java_2.6.2
环境:i5-3210m,8g ddr3,win10 x64,jdk1.8 x64
开发工具:eclipse neon x64(可能用到的web插件此处不再赘述)
2、工具包:
ckeditor_4.5.11_full.zip,ckfinder_java_2.6.2.zip,ckeditor-java-core-3.5.3.zip,三个压缩包都可在官网下载到。
3、把工具引入web工程
(1)ckeditor
ckeditor_4.5.11_full.zip 解压得到的 ckeditor 目录,它的结构如下:把 ckeditor 复制到 web 工程下 WebContent 目录(4)ckfinder
ckfinder_java_2.6.2.zip 解压,得到的目录里有个 CKFinderJava-2.6.2.war,解压这个 war 到某个目录下,它的结构如下:把 ckfinder 目录复制到 web 工程下 WebContent 目录,把 WEB-INF 目录下的 config.xml 复制到web工程下 WebContent/WEB-INF/ 目录下,并改名成 ckfinder.xml 以区别其他 xml 配置文件(5)jar包引入
1)步骤(4)中 war 解压目录下,WEB-INF/lib 目录下的所有 jar 包复制到 web工程的 WebContent/WEB-INF/lib 目录;2)ckeditor-java-core-3.5.3.zip 解压得到一个目录,ckeditor-java-core-3.5.3.jar 复制到 web工程的 WebContent/WEB-INF/lib 目录。到这里, web 工程 WebContent 目录结构如下图:(6)工具包精简(在工程中)
ckeditor:
lang 目录存放国际化文件,通常只保留 en.js 和 zh-cn.js ;
samples 目录存放的是实例,删除该目录;
3个 md 后缀的文件删除。
ckfinder:
_samples 目录删除;
help 目录删除;
lang 语言文件,保留 en.js 和 zh-cn.js;
4个 txt 文本删除。
(注意:还可以进一步精简,请参考其他教程)
4、配置 ckeditor 的 config.js 文件(在工程中)
打开 ckeditor 目录下的 config.js;
以下是一个参考,其中关于 ckfinder 的配置是必须的
5、配置 ckfinder.xmlCKEDITOR.editorConfig = function( config ) {// Define changes to default configuration here. For example:// config.language = 'fr'; config.uiColor = '#FF0000';/* 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.resize_enabled=false;filebrowserBrowseUrl = '/ckfinder/ckfinder.html'; filebrowserImageBrowseUrl = '/ckfinder/ckfinder.html?type=Images'; filebrowserFlashBrowseUrl = '/ckfinder/ckfinder.html?type=Flash'; filebrowserUploadUrl = '/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Files'; filebrowserImageUploadUrl = '/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Images'; filebrowserFlashUploadUrl = '/ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Flash';};
打开 WEB-INF 目录下的 ckfinder.xml。
1)<enabled>true</enabled>,true表示开启cfinder。
2)<baseURL>http://localhost:8080/model2message/upload/</baseURL>,这个标签指定上传文件的存放目录,
tomcat服务器访问地址 + 工程名 + 接收文件夹+"/",我在项目的发布路径下创建了一个 upload 目录,所以是这个访问路径。
3)用户访问权限的设置在 accessControls 标签下,
<accessControls><accessControl><role>*</role><resourceType>*</resourceType><folder>/</folder><folderView>true</folderView><folderCreate>true</folderCreate><folderRename>true</folderRename><folderDelete>false</folderDelete><fileView>true</fileView><fileUpload>true</fileUpload><fileRename>true</fileRename><fileDelete>false</fileDelete></accessControl></accessControls>
6、配置 web.xml
可以参考步骤 3-(4)中war的解压目录下的 WEB-INF 目录下的 web.xml,
7、在 jsp 页面上使用<servlet><servlet-name>ConnectorServlet</servlet-name><servlet-class>com.ckfinder.connector.ConnectorServlet</servlet-class><init-param><param-name>XMLConfig</param-name><span style="color:#ff0000;"><param-value>/WEB-INF/ckfinder.xml</param-value><!--ckfinder.xml是config.xml改名之后--></span></init-param><init-param><param-name>debug</param-name><param-value>false</param-value></init-param><load-on-startup>1</load-on-startup></servlet><servlet-mapping><servlet-name>ConnectorServlet</servlet-name><url-pattern>/ckfinder/core/connector/java/connector.java</url-pattern></servlet-mapping>
这里使用标签创建。
<%@ taglib uri="http://ckeditor.com" prefix="ce"%>
<%@ taglib uri="http://cksource.com/ckfinder" prefix="cf"%>
注意ckfinder标签要放在ckeditor标签之前。
<cf:setupCKEditor editor="ed1" basePath="/model2message/ckfinder/" />
<ce:editor editor="ed1" basePath="/model2message/ckeditor/"></ce:editor>
注:以上简单配置,需要实现更多功能,请参考其他教程,感谢留言。
- ckeditor4.5.11+ckfinder_java2.6.2配置
- ckeditor4配置使用
- ckeditor4.2.1常用配置
- ckeditor4.1配置和使用
- ckeditor4.1配置和使用
- CKEditor4.x部署和配置
- ckeditor4.3工具栏自定义配置
- ckeditor4.1配置和使用
- CKEditor4.x部署和配置
- ckeditor4.2.1在java中的配置
- ckeditor4.6.2上传图片thinphp3.3.2
- CKeditor4.7.3标准版图片上传及相关配置
- CKEditor4.6.2 图片/Flash上传及预览 附件上传
- HTML编辑器 -- CKEditor4.2(工具栏配置等)与CKFinder2.3整合(上传文件)
- ckeditor4.6.2在extjs2的tab页,报错this.document.getWindow().$.getSelection() undefined
- build ckeditor4.0.x
- ckeditor4集成ckfinder2
- ckeditor4.2.2插件应用
- Netty实现shadowsocks客户端
- javasript常用正则表达式
- 【Java并发编程】之五:volatile变量修饰符—意料之外的问题(含代码)
- ESD 保护芯片 PRTR5V0U2X
- java性能优化笔记(三)java程序优化
- ckeditor4.5.11+ckfinder_java2.6.2配置
- Linux系统上针对rm命令做审计
- JS、JQ中remove()、empty
- 【Java并发编程】之六:Runnable和Thread实现多线程的区别(含代码)
- Mybatis入门:(2)接口方式编程
- redis数据库c语言接口
- Java并发编程】之七:使用synchronized获取互斥锁的几点说明
- 处理器管理及并发进程
- 聊聊并发(2):Java SE1.6中的Synchronized