FCKeditor编辑器在JAVA中的使用与配置

工作前的准备

版本是FCKeditor_2.4.2.zip【组件的主文件包】,FCKeditor.Java 2.3.zip【这里面提供了标签库和图片上传的jar】。这些都可以在http://www.fckeditor.net 网站下载到!

配置

1. 新建工程compass,在WebRoot文件夹下新建文件夹FCKeditor(用来存放FCKeditor相关文件,

记得大小写要一致,因为如果你需要改变的话变化的文件比较多,而且还不确定是否改全了)

2. 将FCKeditor_2.4.2包中的 editor 文件夹和fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml

这四个文件放到项目中的 FCKeditor 目录。

3. 将FCKeditor.Java -2.3.zip 包中的 webWEB-INFlib 下的两个 jar 文件到项目的 WebRootWEB-INFlib目录下

4. 将FCKeditor.Java -2.3.zip 包中的 src 下的 FCKeditor.tld 文件到项目的 WebRootWEB-INF 目录

5. 在 WebRoot 目录下新建 UserFiles 文件夹,在此文件夹下新建 Image、 Flash 、File、Media四个文件夹 ,他们分别用来存放上传的图片、动画、文件、媒体文件

6. 修改fckconfig.js组件配置文件【说明一下,你可以在配置文件里搜索等号前面的信息来确定某一项做更改】:

A、FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/silver/' ;

这是组件的样式模板,好确定你到底需要使用哪中样式,这个根据你自己的喜好更改,

B、FCKConfig.DefaultLanguage = 'zh-cn' ;

这个是确定你需要使用哪中语言,设定成上面的表示使用简体中文;

C、更改文件浏览的路径:

FCKConfig.LinkBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Connector=connectors/jsp/connector" ;
FCKConfig.ImageBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Type=Image&Connector=connectors/jsp/connector" ;
FCKConfig.FlashBrowserURL = FCKConfig.BasePath + "filemanager/browser/default/browser.html?Type=Flash&Connector=connectors/jsp/connector" ;

把相应的信息屏蔽掉,使用上面的

D、更改上传文件的路径

FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=File' ;
FCKConfig.FlashUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Flash' ;
FCKConfig.ImageUploadURL = FCKConfig.BasePath + 'filemanager/upload/simpleuploader?Type=Image' ;

把相应的信息屏蔽掉,使用上面的

7. 修改 web.xml 文件,加入以下内容 :

在FCKeditor.Java -2.3.zip 包中有个webWEB-INFWEB.XML,把这个节点里面的内容复制到你的工程里面的相应的位置,值得说明的地方是:

<servlet-name>Connector</servlet-name>
<servlet-class>com.fredck.FCKeditor.connector.ConnectorServlet</servlet-class>
<init-param>
<param-name>baseDir</param-name>
<!-- 此为文件浏览路径,可以只有选择修改,但切记不可改成“/[工程名]/UserFiles/”
因为他目前已经是在工程的根目录下来运行的,故如果要把默认浏览的文件目录为
webrootupload目录,之需要改变成:/upload/,即可 -->
<param-value>/UserFiles/</param-value>
</init-param>
<init-param>
<servlet-name>SimpleUploader</servlet-name>
<servlet-class>com.fredck.FCKeditor.uploader.SimpleUploaderServlet</servlet-class>
<init-param>
<param-name>baseDir</param-name>
<!-- 此为文件上传路径,可以只有选择修改,但切记不可改成“/[工程名]/UserFiles/”
因为他目前已经是在工程的根目录下来运行的,故如果要把上传的文件放到webrootupload目录下,
之需要改变成:/rpload/,即可 -->
<param-value>/UserFiles/</param-value>
</init-param>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<!-- 记得要改变这里,把FALSE改变成TRUE,这个是是否启用上传功能 -->
<param-name>enabled</param-name>
<param-value>true</param-value>
</init-param>
<servlet-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>
/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector
</url-pattern>
</servlet-mapping>
<!-- 别忘记上面和下面加粗部分的代码-->

<servlet-mapping>
<servlet-name>SimpleUploader</servlet-name>
<url-pattern>/FCKeditor/editor/filemanager/upload/simpleuploader</url-pattern>
</servlet-mapping>

优化

以上都是把组件嵌入进工程的 配置过程,下面我们来把组件压缩优化一下,把无用的文件给剔除掉:

删除 WebRootFCKeditoreditorfilemanagerbrowserdefaultconnectors 目录下所有的文件,这些是用来浏览文件的,对于jsp的话是使用了 servlet 来处理,所以这些文件都是多余的

删除 WebRootFCKeditoreditorfilemanagerupload 目录下所有的文件

删除 WebRootFCKeditoreditorlang 目录下不需要的语言,如保留中文【zh-cn.js】和英文[EN.js]还有 fcklanguagemanager.js 文件

删除 WebRootFCKeditoreditorskins 目录下不需要的皮肤文件,有三种皮肤,可根据需要进行删除

JSP页面上的使用

★首先在test.jsp页面的页头加上标签使用语句【不需要做目录调整,已经切实可行】:

★然后在页面的相应位置增加调用语句,对于FCK标签,里面还可以增加很多属性,当然也可以不加,注意下面粗体的地方,我下面使用了2个比较常用的属性,一个是高度的调整,另一个是组件风格

This is FCKeditor demo!

★接收参数可以这么写

其它

1、fckconfig.js总配置文件,可用记录本打开,修改后将文件存为utf-8 编码格式。找到:

FCKConfig.TabSpaces = 0 ; 改为FCKConfig.TabSpaces = 1 ; 即在编辑器域内可以使用Tab键。

2、如果你的编辑器还用在网站前台的话,比如说用于留言本或是日记回复时,那就不得不考虑安全

了,在前台千万不要使用Default的toolbar,要么自定义一下功能,要么就用系统已经定义好的Basic,也就是基本的toolbar,找到:

FCKConfig.ToolbarSets["Basic"] = [
['Bold','Italic','-','OrderedList','UnorderedList','-',/*'Link',*/'Unlink','','Style','FontSize','TextColor','BGColor','-','Smiley','SpecialChar','Replace','Preview'] ] ;

这是改过的Basic,把图像功能去掉,把添加链接功能去掉,因为图像和链接和flash和图像按钮添加功能都能让前台页直接访问和上传文件, fckeditor还支持编辑域内的鼠标右键功能。

FCKConfig.ContextMenu = [

'Generic',/*'Link',*/'Anchor',/*'Image',*/'Flash','Select','Textarea','Checkbox',

'Radio','TextField','HiddenField',/*'ImageButton',*/'Button','BulletedList',

'NumberedList','TableCell','Table','Form'] ;

这也是改过的把鼠标右键的“链接、图像,FLASH,图像按钮”功能都去掉。

3、找到: FCKConfig.FontNames =

'Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;

加上几种我们常用的字体 :

FCKConfig.FontNames = '宋体;黑体;隶书;楷体_GB2312;Arial;Comic Sans MS;

Courier New;Tahoma;Times New Roman;Verdana' ;

4、注意上传的文件名不能有中文,否则无法正常显示或链接下载。

 
 

时间: 2024-10-25 09:15:28

FCKeditor编辑器在JAVA中的使用与配置的相关文章

fckeditor编辑器在php中的配置方法_网页编辑器

一:修改文件上传语言为PHP 打开fckconfig.js 找到: var _FileBrowserLanguage = 'asp' var _QuickUploadLanguage = 'asp' 改成: var _FileBrowserLanguage = 'php' var _QuickUploadLanguage = 'php' 二:启用PHP文件上传 1:启用FileBrowser: 打开fckeditor/editor/filemanager/connectors/php/confi

java中学习笔记(环境配置、Hello World)

一.java开发环境的安装与配置 1.下载JDK. 2.安装JDK.注意在安装时安装路径中不要有空格,例如安装路径为:D:Javajdk1.6.0_30. 3.设置环境变量.可以是用户变量,也可以是系统变量.主要设置内容有:JAVA_HOME.PATH.CLASSPATH,如果没有则新建,如果有就编辑. JAVA_HOME=D:Javajdk1.6.0_30 JAVA_HOME指明JDK的安装路径,此路径下包括lib.bin.jre等文件夹.由于JAVA_HOME变量需要被引用,因此该值末尾不应

asp.net中调用fckeditor编辑器的方法与配置方法

一.集成方法     FCKeditor应用在ASP.NET上,需要两组文件,一组是FCKeditor本身,另一个是用于ASP.NET的FCKeditor控件(分为1.1和2.0两个版本,这里使用2.0版本).     1. 将FCKeditor加入到项目中     解压FCKeditor编辑器,得到文件夹fckeditor,复制此文件夹到Web应用的项目下(也可以是子孙目录下).     解压FCKeditor控件,在其子目录bin/Release/2.0下有一个程序集.在Web应用的项目中引

PHP中如何配置FCKeditor编辑器及上传图片

FCKeditor官网:http://ckeditor.com/ FCKeditor下载:http://ckeditor.com/download 点击去我的CSDN下载 在使用PHP开发留言板.CMS.博客时都涉及文本信息的处理,如何将信息优美地展现在读者面前是PHP网站开发建设者所追求的,而在线编辑器实现了可视化的功能,最早PHP网站开发者都是使用UBB来实现文本信息的展现功能,之后出现了类似于WORD的在线编辑器,今天和大家介绍的是老牌在线编辑器Fckeditor在PHP环境中安装配置与使

ASP中FCKEditor编辑器的设置教程

  1.默认语言 打开fckconfig.js文件(相对FCKeditor文件夹,以下同),把自动检测语言改为不检测,把默认语言改为简体中文: 程序代码 FCKConfig.AutoDetectLanguage = false ; FCKConfig.DefaultLanguage = 'zh-cn' ; 2.字体列表 打开fckconfig.js文件,在字体列表中添加常用的"宋体;黑体;隶书;楷体_GB2312": 程序代码 FCKConfig.FontNames = '宋体;黑体;

请问yii框架中如何通过外界控件插入图片到 fckeditor 编辑器中

问题描述 请问yii框架中如何通过外界控件插入图片到 fckeditor 编辑器中 在yii框架中如何通过外界控件插入图片到 fckeditor 编辑器中 ,如下图操作点击Add添加到下图中纠结了好久,没有结果,知道解决方案的请给于帮助,谢谢.

ThinkPHP中调用FCKeditor编辑器的代码

应用步骤: 1.下载FCKeditor2.x版本,将解压后的文件夹FCKeditor复制到ThinkPHP文件夹下的Vendor目录下,以便符合THinkPHP的第三方类库引入规则. 2.修改参数: 首先,用EditPlus等软件打开FCKeditor目录下的fckeditor_php5.php文件,找到第130行.出现内容如下:  代码如下 复制代码 public function __construct( $instanceName ) {$this->InstanceName = $ins

ThinkPHP中FCKeditor编辑器的使用方法_网页编辑器

而且可以用直接上传和ajax两种方式处理内容.为了给一些还没能成功地集成fckeditor的同侪们一些启发与帮助, 兹将我的经验与体会描述如下:应用目的:将FCKeditor编辑器集成到Thinkphp中,使用户能够在线像编辑Word一样处理即将发表的文字与图像. 应用软件与环境:apache服务器2.0以上版本,PHP版本5.0以上,mysql5.0以上:Thinkphp版本1.5或以上,Fckeditor版本2.x. 应用步骤: 1.下载FCKeditor2.x版本,将解压后的文件夹FCKe

php在页面中调用fckeditor编辑器的方法

刚才在论坛上看到一个童鞋分享的方法,感觉不是很全面,现在分享下我的! 复制代码 代码如下: PHP页面: /* 编辑器 */ include_once "../include/fckeditor/fckeditor.php";//把编辑器引进来 $editor = new FCKeditor('content');//表单项的名称 $editor->BasePath = "/fckeditor/";//编辑器所在目录 $editor->ToolbarSe