欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

Velocity中使用FCKeditor(FCKeditor for java)

程序员文章站 2022-05-26 14:21:38
...

1.下载
fckeditor-java-2.4.1-bin.zip

http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=129511

FCKeditor_2.6.4.zip(基础包)

http://www.fckeditor.net/download

 

2.项目部署

将FCKeditor_2.6.4.zip解压缩,将整个目录FCKeditor复制到项目的根目录下,
目录结构为:和WEB-INF平级
然后将fckeditor-java-2.4.1-bin\fckeditor-java-2.4.1\lib目录下的

slf4j-api-1.5.2.jar、commons-io-1.3.2.jar、commons-fileupload-1.2.1.jar

三个个jar文件拷到项目的\WEB-INF\lib\目录下。

fckeditor-java-2.4.1-bin\fckeditor-java-2.4.1目录下fckeditor-java-core-2.4.1.jar文件也可拷贝到\WEB-INF\lib\目录下。

 

3.整合web.xml

 将以下代码放入web.xml中

	<servlet>
		<servlet-name>Connector</servlet-name>
		<servlet-class>
			net.fckeditor.connector.ConnectorServlet
		</servlet-class>
		<load-on-startup>1</load-on-startup>
	</servlet>

	<servlet-mapping>
		<servlet-name>Connector</servlet-name>
		<!-- Do not wrap this line otherwise Glassfish will fail to load this file -->
		<url-pattern>
			/fckeditor/editor/filemanager/connectors/*
		</url-pattern>
	</servlet-mapping>

 

4.精简FCKeditor

     1>临时文件及文件夹删除:从根目录下开始删除一切以“_”开头的文件及文件夹,因为他们为临时文件和文件夹。删除这类临时文件及文件夹之后,我们还要删除一些根目录下的多余文件,根目录下我们只保留fckconfig.js(配置文件)、fckeditor.js(js方式调用文件)、fckstyles.xml(样式)、fcktemplates.xml(模板)文件和editor文件夹。

      2>editor\lang目录:存放的是多语言配置文件,因为我们只可能用到en和zh-cn(简体中文)所以,根据我的选择,我删掉其他的语言配置文件。

      3>editor\skins界面目录:默认带有三个界面(default:默认界面,加载速度相对较快;office2003:相对pp的界面,不过速度确实要慢些;silver:银白色界面,加载速度也相对较快),可以自行决定是否删除其中一两个。

      4>editor\filemanager\browser\default\connectors目录:存放编辑器所支持的Web动态语言,我们以php为例所以保留php目录,test.html文件可以帮助你查看某语言下的上传设置等(具体上传设置我将在后面的配置作较为详细讲解),可以自行决定是否删除。

       5>editor\filemanager\upload目录:同理。

 

5.FCKeditor配置

  配置选项:
AutoDetectLanguage=true/false 自动检测语言
BaseHref="" _fcksavedurl="""" 相对链接的基地址
ContentLangDirection="ltr/rtl" 默认文字方向
ContextMenu=字符串数组,右键菜单的内容
CustomConfigurationsPath="" 自定义配置文件路径和名称
Debug=true/false 是否开启调试功能,这样,当调用FCKDebug.Output()时,会在调试窗中输出内容
DefaultLanguage="" 缺省语言
EditorAreaCss="" 编辑区的样式表文件
EnableSourceXHTML=true/false 为TRUE时,当由可视化界面切换到代码页时,把HTML处理成XHTML
EnableXHTML=true/false 是否允许使用XHTML取代HTML
FillEmptyBlocks=true/false 使用这个功能,可以将空的块级元素用空格来替代
FontColors="" 设置显示颜色拾取器时文字颜色列表
FontFormats="" 设置显示在文字格式列表中的命名
FontNames="" 字体列表中的字体名
FontSizes="" 字体大小中的字号列表
ForcePasteAsPlainText=true/false 强制粘贴为纯文本
ForceSimpleAmpersand=true/false 是否不把&符号转换为XML实体
FormatIndentator="" 当在源码格式下缩进代码使用的字符
FormatOutput=true/false 当输出内容时是否自动格式化代码
FormatSource=true/false 在切换到代码视图时是否自动格式化代码
FullPage=true/false 是否允许编辑整个HTML文件,还是仅允许编辑BODY间的内容
GeckoUseSPAN=true/false 是否允许SPAN标记代替B,I,U标记
IeSpellDownloadUrl=""下载拼写检查器的网址
ImageBrowser=true/false 是否允许浏览服务器功能
ImageBrowserURL="" 浏览服务器时运行的URL
ImageBrowserWindowHeight="" 图像浏览器窗口高度
ImageBrowserWindowWidth="" 图像浏览器窗口宽度
LinkBrowser=true/false 是否允许在插入链接时浏览服务器
LinkBrowserURL="" 插入链接时浏览服务器的URL
LinkBrowserWindowHeight=""链接目标浏览器窗口高度
LinkBrowserWindowWidth=""链接目标浏览器窗口宽度
Plugins=object 注册插件
PluginsPath="" 插件文件夹
ShowBorders=true/false 合并边框
SkinPath="" 皮肤文件夹位置
SmileyColumns=12 图符窗列数
SmileyImages=字符数组 图符窗中图片文件名数组
SmileyPath="" 图符文件夹路径
SmileyWindowHeight 图符窗口高度
SmileyWindowWidth 图符窗口宽度
SpellChecker="ieSpell/Spellerpages" 设置拼写检查器
StartupFocus=true/false 开启时FOCUS到编辑器
StylesXmlPath="" 设置定义CSS样式列表的XML文件的位置
TabSpaces=4 TAB键产生的空格字符数
ToolBarCanCollapse=true/false 是否允许展开/折叠工具栏
ToolbarSets=object 允许使用TOOLBAR集合
ToolbarStartExpanded=true/false 开启是TOOLBAR是否展开
UseBROnCarriageReturn=true/false 当回车时是产生BR标记还是P或者DIV标记

 

6.创建在Velocity中使用FCKeditor的类

   新建类如下所示:

/**
 * 包名:com.lyw.cms.base.utill<br>
 * 文件:FCKeditorWrapper.java<br>
 * 作者:zohan[[email protected]]
 * 时间:20097:42:27 PM<br>
 * 
 * Current revision $Revision: 1.1 $<br>
 * Latest change by $Author: zohan $<br>
 * $Log: FCKeditorWrapper.java,v $
 * Revision 1.1  2009/04/24 04:32:28  zohan
 * 文章开始
 * <br>
 */
package com.lyw.cms.base.utill;

import javax.servlet.http.HttpServletRequest;

import net.fckeditor.FCKeditor;

/**
 * @author Administrator
 * 
 */
public class FCKeditorWrapper {
	private HttpServletRequest request;

	public FCKeditorWrapper(final HttpServletRequest request) {
		this.request = request;
	}

	/**
	 * 
	 * @param instanceName 参数名称
	 * @param value
	 * @return
	 */
	public String get(final String instanceName, final String value) {
		FCKeditor editor = new FCKeditor(request, instanceName);
		editor.setValue(value);
		return editor.createHtml();
	}

	/**
	 * 
	 * @param instanceName 参数名称
	 * @param width
	 * @param height
	 * @param toolbarSet
	 * @param value
	 * @return
	 */
	public String get(final String instanceName, final String width,
			final String height, final String toolbarSet, final String value) {
		FCKeditor editor = new FCKeditor(request, instanceName, width, height,
				toolbarSet, value, null);
		editor.setValue(value);
		return editor.createHtml();
	}

}

 

 7.在Velocity中使用FCKeditor

     将FCKeditorWrapper 放入Velocity能调用的地方并取名为editor,例如:

     

   FCKeditorWrapper fck = new FCKeditorWrapper(request);
   request.setAttribute("editor", fck);

     在Velocity中使用

<form method="post" action="save.action">
   $editor.get("content", "请在这里填入内容");
   <input type="submit" value="提交" />
</form>