我的环境为 liferay6.2,CKEditor4.4.3,ckfinder2.4.1 集成java 1.下载工具包 CKEditor 下载地址 http://ckeditor.com/download 下载后为ckeditor_4.4.3_standard.zip 下载java所需的jar文件 ckeditor-java-core-3.5.3.zip ckfinder 下载地址 http://ckfind

我的环境为liferay6.2,CKEditor4.4.3,ckfinder2.4.1 集成java

1.下载工具包

CKEditor 下载地址 http://ckeditor.com/download

下载后为 ckeditor_4.4.3_standard.zip

下载java所需的jar文件 ckeditor-java-core-3.5.3.zip

ckfinder下载地址 http://ckfinder.com/download

下载后为 ckfinder_java_2.4.1.zip

2. 整合

解压上面下载的三个文件,将ckeditor_4.4.3_standard.zip解压的文件全部复制到项目中 docroot 根目录下,

接着解压:ckfinder_java_2.2.1.zip,将ckfinder_java_2.2.1/ckfinder下的 CKFinderJava.war再次解压,找到CKFinderJava下的ckfinder文件夹,将其拷贝到docroot 根目录下

结构图:

接下来就是整合所需要的jar包,到刚才解压的war 包( CKFinderJava.war)下找,位置如下:ckfinder\CKFinderJava\WEB-INF\lib

将jar包全部拷贝放到项目docroot--> WEB-INF --> lib下

接着把配置文件:config.xml也拷贝到docroot/WEB-INF下

配置文件同样到刚才解压的WAR下找,路径为:ckfinder\CKFinderJava\WEB-INF

打开config.xml,

第二行的false换成:true

第四行的/test-portlet/userfiles/ 换成/CkeditorForJava/userfiles/

注意:此处的test-portlet是根据你的项目名定的。

打开web.xml,添加以下内容

FileUploadFilter

com.ckfinder.connector.FileUploadFilter

sessionCookieName

JSESSIONID

sessionParameterName

jsessionid

FileUploadFilter

/ckfinder/core/connector/java/connector.java

ConnectorServlet

com.ckfinder.connector.ConnectorServlet

XMLConfig

/WEB-INF/config.xml

debug

false

1

ConnectorServlet

/ckfinder/core/connector/java/connector.java

我放在docroot下面 所以配置 /ckfinder/core/connector/java/connector.java

你要是放在docroot/js下面 就直接配置js/ckfinder/core/connector/java/connector.java

新建portlet页面

view.jsp 代码

标题

类型

常规

博客

上市时间段

textEditor.js 代码

var ckeditorText;

$(document).ready(function() {

initCKEditor();

});

/**

* 提交数据

*/

function submitData() {

// 取值

console.info(ckeditorText.getData());

}

/**

* 初始化编辑器

*/

function initCKEditor() {

if (CKEDITOR.instances['textEditor']) {

CKEDITOR.remove(CKEDITOR.instances['textEditor']);

}

// 项目名称

var basePath = '/test-portlet/';

// CKEDITOR.replace("textEditor");

// 配置修改ckfinder路径不能出错,出错就出不来,此配置也可以在ckeditor文件夹下的config.js中做修改

ckeditorText = CKEDITOR

.replace(

"textEditor",

{

filebrowserBrowseUrl : basePath

+ 'ckfinder/ckfinder.html',

filebrowserImageBrowseUrl : basePath

+ 'ckfinder/ckfinder.html?type=Images',

filebrowserFlashBrowseUrl : basePath

+ 'ckfinder/ckfinder.html?type=Flash',

filebrowserUploadUrl : basePath

+ 'ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Files',

filebrowserImageUploadUrl : basePath

+ 'ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Images',

filebrowserFlashUploadUrl : basePath

+ 'ckfinder/core/connector/java/connector.java?command=QuickUpload&type=Flash',

filebrowserWindowWidth : '1000',

filebrowserWindowHeight : '1000'

});

}

配置完后就可以正常启动了。效果

3.优化

移除这些无用的信息

2. 去掉左下角说明方法,打开ckfinder下面的ckfinder.js文件,查找this.dV().getChild(0).appendHtml,其他变量会变,屏蔽这句代码就可以

/**if(!D)this.dV().getChild(0).appendHtml(A||B||y!=4?t:u+"\x3c\142\076"+k.htmlEncode(a.ed)+"\x3c\057\142\076\074\x2f\x64\x69\x76\x3e");*/

则左下面的说明会消失

本文原创发布php中文网,转载请注明出处,感谢您的尊重!

liferay6.2 mysql_liferay6.2 集成CKEditor和ckfinder相关推荐

  1. 12.HTML编辑器(CKEditor、CKFinder集成)

    CKEditor原名为FckEditor,是著名的HTML编辑器,可以在线编辑HTML内容. 配置参考文档:主要将ckeditor中的lang.plugins.skins.ckeditor.js.co ...

  2. Spring Boot集成CKEditor

    2019独角兽企业重金招聘Python工程师标准>>> CKEditor is a free, Open Source HTML text editor designed to si ...

  3. CKEditor配合CKFinder的使用

    .net 中如何配置 CKEditor和CKFinder 一.官方Download 1.CKEditor :点击CKEditor.NET标题下的"Download zip"按钮 此 ...

  4. (转)基于MVC4+EasyUI的Web开发框架经验总结(5)--使用HTML编辑控件CKEditor和CKFinder...

    http://www.cnblogs.com/wuhuacong/p/3780356.html Web开发上有很多HTML的编辑控件,如CKEditor.kindeditor等等,很多都做的很好,本文 ...

  5. (转)CKEditor和CKFinder在ASP.NET中的应用

    CKEditor和CKFinder在ASP.NET中的应用,需要的朋友可以参考下. CKEditor是新一代的FCKeditor,是一个重新开发的版本.CKEditor是全球最优秀的网页在线文字编辑器 ...

  6. CKEditor和CKFinder及CKEditor配置属性说明

    最近在做一个新闻发布平台,放弃了很早的FCKEditor,使用CKEditor和CKFinder,尽管免费的CKFinder是Demo版本,但是功能完整,而且用户都是比较集中精神发新闻的人,不会在意这 ...

  7. ckEditor 和 ckFinder 的使用

    介绍> CKEditor是新一代的FCKeditor,是一个重新开发的版本. CKFinder是一个功能强大的ajax文件管理器. ------------------------------- ...

  8. .net中ckeditor,ckFinder的使用

    一.使用方法: 1.在页面<head>中引入ckeditor核心文件ckeditor.js <script type="text/javascript" src= ...

  9. ckeditor 和ckfinder配置

    ckeditor+ckfinder配置用法 一.使用方法: 1.在页面<head>中引入ckeditor核心文件ckeditor.js <script type="text ...

最新文章

  1. linux下清理信号量,Linux下kill的信号量列表
  2. Macbook air 键盘标点符号怎么输出?
  3. 数据结构:栈、队列、数组、链表、红黑树结构的特点
  4. Long Long Message
  5. Wannafly挑战赛17
  6. 【译文练习】ReactiveCocoa概要:了解和使用RACCommand
  7. php package manager,package命令的安装教程
  8. Diskpart命令安装系统小结
  9. Digital root(数根)
  10. macbook 放flash发烫,转html5
  11. 感谢3G,告别3G:开启移动互联网时代的“功臣”退出历史舞台
  12. web-jsp(15) 购物车
  13. R语言软件和RStudio环境的下载与安装
  14. JDK 的下载与安装(非常详细!)
  15. 全球电动汽车电池隔膜行业调研及趋势分析报告
  16. 大陆身份证号码正则验证js脚本
  17. Arch 使用 i3 美化桌面
  18. 利用电脑玩android版天天连萌刷高分 二,利用电脑玩Android版“天天连萌”刷高分(二)——图像识别...
  19. ribbonmq超时配置_使用RabbitMQ实现订单超时取消(延迟队列)
  20. 【设计模式】设计模式

热门文章

  1. 语言与区域设置ID (Language ID、Locales ID / LCID)
  2. vMotion及Storage vMotion配置
  3. 如何高效地为室友电脑清理 C 盘?
  4. 听完“Java 教父”李刚的分享,我总结了两点建议
  5. 华为p30怎么升级鸿蒙系统
  6. 移动支付难倒老年人 如何让他们不被时代抛弃?
  7. ARM CPU性能优化:FP32 、FP16 和BF16区别
  8. P2员工月度工作P160-P163
  9. 贝叶斯决策理论之入门篇
  10. matlab MAM1算法和FPGA实现