以下均在tomcat服务器下操作(不是开发环境下的操作)
首先下载两个包:FCKeditor_2.6.4.zip,(FCKeditor主文件)FCKeditor-2.3.zip,(jsp,FCKeditor整合包)
第一步:解压FCKeditor_2.6.4.zip,(FCKeditor主文件),将fckeditor目录复制到网站根目录下,如果架设一个以bbs为名的网站,把fckeditor目录复
制到bbs目录下(注意是tomcat下面的bbs文件目录,而不是开发环境下的bbs目录)。
第二步:解压FCKeditor-2.3.zip,(jsp,FCKeditor整合包,在官网上它是属于java文件那个部分),将FCKeditor-2.3/web/WEB-INF/web.xml中的两个
servlet,servlet-mapping定义复制到自已项目的web.xml文件(注意是tomcat下的/bbs/WEB-INF/web.xml的web.xml文件)中 修改自已项目的web.xml文件中的:
<servlet-mapping> <servlet-name> Connector </servlet-name> <url-pattern> /editor/filemanager/browser/default/connectors/jsp/connector </url-pattern> </servlet-mapping>
<servlet-mapping> <servlet-name> SimpleUploader </servlet-name> <url-pattern> /editor/filemanager/upload/simpleuploader </url-pattern> </servlet-mapping>
为 :
<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>
将FCKeditor-2.3/web/WEB-INF/lib目录下文件复制到自已项目的lib文件夹(注意是tomcat下的/bbs/WEB-INF/lib文件夹)中,
第三步:在(bbs下)网站根目录建立一个test.jsp和test1.jsp文件
test.jsp文件的内容是:<%@ page language="java" import="com.fredck.FCKeditor.*" %> <form action=test1.jsp method="post"><% FCKeditor oFCKeditor ; oFCKeditor = new FCKeditor( request, "EditorDefault" ) ; oFCKeditor.setBasePath( request.getContextPath() + "/fckeditor/" ) ; oFCKeditor.setValue( "This is some <strong> sample text </strong> . You are using <a
href=\"http://www.fredck.com/fckeditor/\"> FCKeditor </a> ." ); out.println(oFCKeditor.create()) ; %> <input type="submit" name="Submit" value="提交" onClick="return checkForm()" /><input type="reset" name="Submit2" value="重置"></form>
test1.jsp文件的内容是:<%@ page language="java" import="java.util.*"%><%String contentString = (String)request.getParameter("EditorDefault");out.println("***************<br>"); out.println("contentString="+contentString);out.println("***************<br>"); %>
意思是,在test.jsp中创建一个FCKeditor对象,然后在它的初始化方法中把EditorDefault作为属性,并且和request关联起来然后在test1.jsp里面通过request.getParameter读取属性EditorDefault的值,这个值就是文本编辑器的内容,可以直接存放到数据库中读出来以后是按html翻译后的,即和编辑时的一模一样。
注意事项:以下是使用在线编辑器必不可少的<%@ page language="java" import="com.fredck.FCKeditor.*" %>
<%FCKeditor oFCKeditor ; oFCKeditor = new FCKeditor( request, "EditorDefault" ) ; oFCKeditor.setBasePath( request.getContextPath() + "/fckeditor/" ) ; out.println(oFCKeditor.create()); %>
精简内容(以下均为摘抄):
最后开始配置工具栏,工具栏的配置主要是对 fckeditor 目录下的 fckconfig.js 进行修改。
可以在网上搜索‘fckconfig.js’或者 ‘FCK 工具栏’,找到一篇文章:FCK编辑器精简工具栏
fckconfig.js 中关于工具栏的设置原始为:
FCKConfig.ToolbarSets["Default"] = [ ['Source','DocProps','-','Save','NewPage','Preview','-','Templates'], ['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'], ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'], ['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'], '/', ['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'], ['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote'], ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'], ['Link','Unlink','Anchor'], ['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'], '/', ['Style','FontFormat','FontName','FontSize'], ['TextColor','BGColor'], ['FitWindow','ShowBlocks','-','About'] // No comma for the last row. ] ;
文章里精简为:
//默认编辑器工具栏设置 FCKConfig.ToolbarSets["Default"] = [ ['Source'],['PasteText','PasteWord','-'], ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat','-','Subscript','Superscript'], ['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','ShowBlocks'], '/', ['Bold','Italic','Underline','StrikeThrough'], ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'], ['Link','Unlink'],['TextColor','BGColor'], ['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'], '/', ['FontFormat','FontName','FontSize'],
] ;
最后我去除了一些功能,精简为:
FCKConfig.ToolbarSets["Default"] = [ ['PasteText','PasteWord','-'], ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat','-','Subscript','Superscript'], ['OrderedList','UnorderedList','-','Outdent','Indent'], ['Link','Unlink'],['TextColor','BGColor'], ['Table','Rule','SpecialChar','PageBreak'], '/', ['Bold','Italic','Underline','StrikeThrough'], ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'], ['FontFormat','FontName','FontSize'], ] ;
注意里面可以任意变换顺序, '/', 代表分行, 一个 [] 里的内容为一个集中区域。
深圳人才网 深圳招聘网 深圳人才招聘网 深圳人才大市场
企业、个人免费注册,获取想要的 深圳 软件工程师招聘信息 月薪最低3000-8000,更有高端猎头职位!
www.szrcwz.com
