javaweb编辑器ckeditor配置_ckeditor编辑器在java项目中配置
一、基本使用:
1、所需文件架包
A. Ckeditor基本文件包,比如:ckeditor_3.6.2.zip
2、配置使用
A.将下载下来的CKEditor压缩解压,将解压后的文件夹(“ckeditor”)拷贝进项目里面,比如我是放在”WebContent”的”commons”文件夹下;
B.在需要使用CKEditor的页面引入CKEditor的支持javascript
C.一般我们的内容是使用一个””来显示内容,然后使用调用脚本替换
Initial value.
D.CKEDITOR.replace(“editor1”)中的”editor1”为id或者是name搜索方式默认是先按id来搜索,没找到再按name来搜索
E.具体的图例
二、Java项目中配置使用:
1、所需文件架包
A.Ckeditor基本文件包,比如:ckeditor_3.6.2.zip
B.CKEditor for Java 架包,比如:ckeditor-java-core-3.5.3.jar
2、配置使用
A.将下载下来的CKEditor压缩解压,将解压后的文件夹(“ckeditor”)拷贝进项目里面,比如我是放在”WebContent”的”commons”文件夹下;
B.将下载下来的CKEditorfor Java 包(ckeditor-java-core-3.5.3.jar)复制进项目” /WEB-INF/lib”目录;
C.在需要使用CKEditor的jsp页面配置CKEditor的标签,以后使用通过标签使用
D.一般我们的内容是使用一个””来显示内容,然后替换成CKEditor编辑器
Initial value.
* replace只的是textarea的name或者id
* basePath CKEditor的根目录
三、Java项目中配置使用并支持简单的图片上传功能:
CKEditor在Java项目中配置使用,并支持图片的上传功能。原理是通过showModalDialog来实现的,弊端不支持Chrome浏览器,IE,FireFox支持;
1、所需文件架包
A.Ckeditor基本文件包,比如:ckeditor_3.6.2.zip
B.CKEditor for Java 架包,比如:ckeditor-java-core-3.5.3.jar
2、配置使用
A.将下载下来的CKEditor压缩解压,将解压后的文件夹(“ckeditor”)拷贝进项目里面,比如我是放在”WebContent”的”commons”文件夹下;
B.将下载下来的CKEditorfor Java 包(ckeditor-java-core-3.5.3.jar)复制进项目” /WEB-INF/lib”目录;
C.在需要使用CKEditor的jsp页面配置CKEditor的标签,以后使用通过标签使用
D.一般我们的内容是使用一个””来显示内容,然后替换成CKEditor编辑器
Initial value.
* replace只的是textarea的name或者id
* basePath CKEditor的根目录
E.简单快捷的给CKEditor加上图片上传功能
CKEditor非常好用,但它的图片/文件上传使用了CKFinder,虽然功能非常强大,但集成起来还是比较麻烦,而且根据应用还需要改造。如果自己的应用已经有图片/文件上传模块,能否直接拿过来用呢?答案是肯定的,而且非常简单,就是在图片链接输入框的右边加个按钮,点击事件链接到已有的上传模块,上传后把图片的url传递给左边的输入框即可。步骤如下:
打开ckeditor\plugins\image\dialogs\image.js,在链接输入框代码结尾也就是“m.lang.image.urlMissing)},”后面加上这些代码:
“{type:'button',id:'myUpload',align:'center',label:'新上传',onClick:function(){varretFile = showModalDialog("/common/uploadImage.jsp","", "dialogHeight:20;dialogWidth:29;"); if(retFile !=null){this.getDialog().setValueOf('info','txtUrl',retFile);}}},”
“/common/uploadImage.jsp”是应用已经有的上传模块链接,上传成功后通过模式对话框的returnValue返回图片链接,比如在上传成功页面加上如下js函数,点击确定时调用。
function Done() {
window.returnValue = imgPath;//上传后的图片链接
window.close();
}
四、Java项目中配置使用并支持图片上传功能包括FTP上传,图片压缩:
CKEditor在Java项目中配置使用,并支持图片的上传功能。原理是通过commons-fileupload上传组件实现的,这里已经封装好上传处理Servlet只需要在配置文件ckeditor.properties 中配置相关FTP服务器信息,是否压缩图片,上传附件的大小格式限制等。
1、所需文件架包和配置文件
A.Ckeditor基本文件包,比如:ckeditor_3.6.2.zip
B.CKEditor for Java 架包,比如:ckeditor-java-core-3.5.3.jar
C.Apache的上传组包 commons-fileupload,比如:commons-fileupload-1.2.1.jar
D.Apache的上传组包 commons-io,比如:commons-io-1.4.jar
E.Apache的FTP组件包commons-net, 比如:commons-net-ftp-2.0.jar
F.Apache的工具包 commons-lang,比如:commons-lang-2.5.jar
G.上传处理组件包 ckeditor-upload-1.0.jar
自己封装的基于Servlet的图片上传处理组件
H.CKEditor的图片上传配置属性文件:ckeditor.properties
I.CKEditor的配置文件 config.js
2、配置使用
A.将下载下来的CKEditor压缩解压,将解压后的文件夹(“ckeditor”)拷贝进项目里面,比如我是放在”WebContent”的”commons”文件夹下;
B.将下载下来的所需组件架包拷贝进项目” /WEB-INF/lib”目录;
C.将图片上传配置文件ckeditor.properties拷贝到项目SRC(classes)根目录下
属性文件内容如下:
# default allowed extensionssettings
ckeditor.resourceType.media.extensions.allowed=.aiff|.asf|.avi|.bmp|.fla|.flv|.gif|.jpeg|.jpg|.mid|.mov|.mp3|.mp4|.mpc|.mpeg|.mpg|.png|.qt|.ram|.rm|.rmi|.rmvb|.swf|.tif|.tiff|.wav|.wma|.wmv
# base directory for the userfiles relative to the context root
ckeditor.userFilesPath=/files/ckeditor/
# default encoding
ckeditor.encoding=UTF-8
# default file size threshold: 1*1024*1024 = 1048576
ckeditor.size.threshold=1048576
# default one file size :5*1024*1024 = 52428800
ckeditor.file.size.max=52428800
# default all files size :10*1024*1024 = 10485760
ckeditor.size.max=10485760
# some messages
message.request.not.contain.images=Requestdoes not contain image or media file.
message.request.general.form=Request is thegeneral form.
message.request.file.max=One file is toolarge.
message.request.all.file.max=All files is toolarge.
# ftp configurations
# open ftp file upload istrue otherwise false
ftp.upload=true
ftp.server=127.0.0.1
ftp.user_name=jjy
ftp.password=123
ftp.port=21
# image resize configurations
# open image resize is trueotherwise false
image.resize=true
#resizeByMaxSize:0,resizeByRatio:1,resizeByFixedWidth:2,resizeByFixedHeight:3
image.resize.type=0
# resize size 100,120,240,400,640
image.resize.size=120,240,400
D.CKEditor配置文件” /ckeditor/config.js”修改
CKEDITOR.editorConfig = function(config) {
//获取项目的目录比如:http://www.mymyty.com
var strFullPath = window.document.location.href;
var strPath = window.document.location.pathname;
var pos = strFullPath.indexOf(strPath);
var prePath = strFullPath.substring(0,pos);
var postPath =strPath.substring(0,strPath.substr(1).indexOf('/')+1);
var path_url = prePath+postPath;
//显示出图片上传模块
config.pasteFromWordRemoveStyles = true;
config.filebrowserImageUploadUrl = path_url + "/commons/ckeditor/images/upload.html"; //为图片上传处理Servlet在web.xml中配置
//去掉ckeditor“保存”按钮
config.removePlugins = 'save';
};
E.在web.xml中配置Servlet
ckeditor
com.ebiz.ssi.ckeditor.CkeditorImagesUploadServlet
1
ckeditor
/commons/ckeditor/images/upload.html
F.在需要使用CKEditor的jsp页面配置CKEditor的标签,以后使用通过标签使用
G.一般我们的内容是使用一个””来显示内容,然后替换成CKEditor编辑器
Initial value.
* replace只的是textarea的name或者id
* basePath CKEditor的根目录
五、CKEditor中config.js配置文件的说明即样式自定义调整:
Congfig.js是CKDitor的配置文件,在这个里面可以修改编辑器的样式和所需工具栏等等
config.language= 'zh-cn'; // 编辑器语言
config.width =600; //初始化时的宽度
config.height = 400; //初始化时的高度
config.skin='kama'; //编辑器样式,有三种:’kama’(默认)、’office2003′、’v2′
config.tabSpaces =4;
config.resize_maxWidth =600; //如果设置了编辑器可以拖拽 这是可以移动的最大宽度
config.toolbarCanCollapse =false; //工具栏可以隐藏
//config.toolbarLocation ='bottom'; //可选:设置工具栏在整个编辑器的底部bottom
config.resize_minWidth =600; //如果设置了编辑器可以拖拽 这是可以移动的最小宽度
config.resize_enabled =false; //如果设置了编辑器可以拖拽
//以下是后添加的验证非法数据
config.protectedSource.push(//gi); //tags.
config.protectedSource.push(//gi); //
tags.
config.protectedSource.push(//gi); // tags.
config.protectedSource.push(//gi); //
config.baseFloatZIndex = 10000; // 编辑器的z-index值
config.baseHref = “”; //设置是使用绝对目录还是相对目录,为空为相对目录
六、CKEditor精简说明:
下载了完整的程序之后,先要对程序中的不必要的东西进行删除。凡是文件名或文件夹名前面有"_"的文件或文件夹都可以删除,这些文件是一些说明文件或者实例文件。另外,./lang文件夹中,只保留:zh_cn.js,en.js文件即可,这个文件夹是程序的语言包,因为其它语言大家用不到,放在那里也占用空间,所以删掉。./skins文件夹是编辑器的界面,根据情况保留至少一个文件夹即可,其中kama是可自定颜色UI的文件,建议保留,当然如果不在乎空间大小的话,也可以全部上传。删除根目录下的changes.html(更新列表),install.html(安装指向),license.html(使用许可).
javaweb编辑器ckeditor配置_ckeditor编辑器在java项目中配置相关推荐
- Java项目中利用Freemarker模板引擎导出--生成Word文档
应邀写的一篇文章:Java项目中利用Freemarker模板引擎导出--生成Word文档 资源下载:https://download.csdn.net/download/weixin_41367523 ...
- Mac笔记本中是用Idea开发工具在Java项目中调用python脚本遇到的环境变量问题解决...
问题描述: mac笔记本本身会自带几个python版本,比如python2.7版本,我没有改动mac默认的python版本,只是安装了python3.7版本. 使用Pycharm开发Python项目没 ...
- 【Android 安全】DEX 加密 ( 代理 Application 开发 | 项目中配置 OpenSSL 开源库 | 使用 OpenSSL 开源库解密 dex 文件 )
文章目录 一.项目中配置 OpenSSL 开源库 二.OpenSSL 开源库解密参考代码 三.解密 dex 文件的 Java 代码 四.解密 dex 文件的 Jni 代码 参考博客 : [Androi ...
- XML在JAVA项目中的作用
java项目中,xml文件一般都是用来存储一些配置信息 一般的编程, 多数用来存储配置信息 . 拿JDBC来说,可以把数据库连接字符串写到xml,如果要修改数据源,只需要改xml就可以了,没必要再去重 ...
- log4jdbc oracle,通过weblogic配置log4jdbc数据源,在项目中使用该数据源,输出sql
通过weblogic配置log4jdbc数据源,在项目中使用该数据源,输出sql 通过weblogic配置log4jdbc数据源,在项目中使用该数据源,输出sql 说一下配置: 服务器weblogic ...
- Redis学习笔记之二 :在Java项目中使用Redis
成功配置redis之后,便来学习使用redis.首先了解下redis的数据类型. Redis的数据类型 Redis支持五种数据类型:string(字符串),hash(哈希),list(列表),set( ...
- redis java驱动_Redis学习笔记之二 :在Java项目中使用Redis
成功配置redis之后,便来学习使用redis.首先了解下redis的数据类型. Redis的数据类型 Redis支持五种数据类型:string(字符串),hash(哈希),list(列表),set( ...
- Ant在Java项目中的使用(一眼就看会)
参考:http://www.cnblogs.com/zhengqiang/p/5557155.html Ant是跨平台的构建工具,它可以实现项目的自动构建和部署等功能.在本文中,主要让读者熟悉怎样将A ...
- 在Java项目中整合Scala
Scala是一个运行在Java JVM上的面向对象的语言.它支持函数编程,在语法上比Java更加灵活,同时通过Akka库,Scala支持强大的基于Actor的多线程编程.具有这些优势,使得我最近很想在 ...
最新文章
- 主流微服务全链路监控系统之战
- stm32定时器中断_stm32F4之定时器的基本使用
- HttpURLConnection 发送post请求。并将结果以JSONObject对象返回的轮子
- 【转】ASP中的SQL注入
- [PAMI2013] Guided Image Filtering 导向滤波器以及OpenCV-Python代码实现
- 使用report CFD_CREATE_FIELD创建extension field
- [设计模式]策略模式
- Python中append和extend的区别
- 大数据MongoDB之NoSQL的CAP定理和BASE原则是什么?
- oracle trap,配置SNMP trap
- 报班华为HCIE的课程需要有IA和IE的基础吗?
- LLVM编写Pass对程序进行obfuscate
- 计算机主机爆炸,意外:插入计算机后,主机的电源就会烧断。发生了什么?计算机电源爆炸了吗?...
- 奥塔哥大学计算机科学怎样,2019QS世界大学学科排名出炉,新西兰最强专业看过来!...
- 原生64位卸载工具Revo Uninstaller Pro V2.5.7
- Linux I/O编程 实验内容
- 删除redis所有KEY
- 【开源】STM32硬盘音圈电机闭环控制
- 数据库类型区分 原创
- linux驱动之一、LED驱动(驱动代码小结附:github代码链接)
热门文章
- AWT_Swing_JTextField (Java)
- Java内存分析—栈,堆,方法区
- linux环境下安装robot,install robotframework (linux)
- 《强化学习》中的第14章:心理学
- 熟悉 scrollTop ,轻松做5个方面的事情。
- html 显示文本字段,HTML文本框和文本字段样式_五五站长网
- 集算器协助MongoDB计算之交叉汇总
- 云计算成了“晕技术”就对了
- 使用Jasypt加密spring boot应用配置文件的敏感信息
- 开机没有自检声,显示器无信号及各版本BIOS报警信号大全 转