`
accphc
  • 浏览: 124588 次
  • 性别: Icon_minigender_1
  • 来自: CD
社区版块
存档分类
最新评论

FCK的使用简介

阅读更多

引入网页:

    首先下载附件中FCK提高的编辑器代码,也可以到其官方网站http://www.fckeditor.net去下载和看帮助文档。

    把FCKeditor_2.6.3.zip解压copy里面的fckeditor到我们的工程中,再 把fckeditor-java-2.4-bin.zip里面的5个jar包copy到lib下面去。FCK提供了几种引入方式:

 

  •     通过js调用。引入<script type=text/javascript src=fckeditor/fckeditor.js></script>,在需要插入编辑器的地方通过下面代码创建
     var oFCKeditor=new FCKeditor('eidtor');
    oFCKeditor.BasePath="/fckTest/fckeditor/";
    oFCKeditor.Create();
       
  •    通过jsp标签调用。引人<%@ taglib uri="http://java.fckeditor.net" prefix="fck"%>,在需要插入编辑器的地方通过下面代码创建
    <fck:editor instanceName="editor" basePath="/fckeditor" value=" " width="90%" height="300" toolbarSet="DEFAULT"/>
     
属性设置:

 

属性名

描述

默认值

Width

宽度

100%

Height

高度

200

Value

初始化值

空字符串

ToolbarSet

工具条集合的名称(Basic|Default)

Default

BasePath

编辑器的基路径

/fckeditor/

    说明:value初始化时必须提供一个初始化值,通常为“ ”,因为如果不这样的话会报NullPointerExcepton,这也算FCK的一个Bug,不过也可以通过修改它net.fckeditor.FCKeditor解决,在我提供的例子中有说明。


自定义配置:

    在属性中有一个ToolbarSet的工具条属性,默认为Default,实际上我们可以定义自己的属性条,方法是通过修改fckeditor下面的fckconfig.js,而更合理的方式是新建一个自己的配置文件newconfig.js,然后在fckconfig.js中指定使用自己的配置文件也就是告诉其自己的配置文件在什么地方FCKConfig.CustomConfigurationsPath = '/fcktest/newconfig.js' ;
    
//设置自定义的工具栏

FCKConfig.ToolbarSets["DIY"] = [
	['Style','FontFormat'],
	['FontName','FontSize','Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript','-','TextColor','BGColor'],
	'/',
	['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
	['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
	['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
		
	'/',
	['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
	['Link','Unlink','Anchor'],	
	['-','NewPage','Preview','FitWindow','ShowBlocks','Source']
] ;

       说明:[]代表的是一组,-代表的是竖分割线,/代表换行

    此外,还可以自定义其他的配置,比如可以设置皮肤、更换字体、更换表情图片等。可以自己去研究……   

图片上传:

    FCK自带了一个后台图片上次的处理器(实际上是个Servlet),但是它自带的东西不满足我们的需求,而且老外的东西当我们处理中文名字的图片会有乱码,所以需要修改,要进行图片上传首先做以下事情

 

  1. 在src下新建一个文件fckeditor.properties 并在其中添加connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl

 

     2.  建立一个Connector,copy net.fckeditor.connector.ConnectorServlet的源码到我们自己定义的Connector,根据需求,上传的图片我们自己重命名,那么找到filename,用filename=ID.nextID()+"."+extension;替代。

 

    3.  在Web.xml里面声明这个servlet
     <servlet>

    <servlet-name>ConnectorServlet</servlet-name>
    <servlet-class>connector.ConnectorServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>ConnectorServlet</servlet-name>
    <url-pattern>/fckeditor/editor/filemanager/connectors/*</url-pattern>
  </servlet-mapping>
 

4.其他方面,比如更改url,限制文件上传大小等需求可以自己去探索研究哈。

 

 

给FCK瘦身:删除fckeditor目录下面所有以“_”开头的文件或者文件夹,像"_samples"、"_documentation.html“等

     删除fckeditor目录下面除了,fckconfig.js   fckpackage.xml fckstyles.xml   fcktemplates.xml外的所有文件,当然要保留editor文件夹

     删除fckeditor/editor/lang目录下面除了en.js、 zh-cn.js外的所有文件

     删除fckeditor\editor\filemanager目录下面的connectors文件夹

     删除editor\skins目录下面除了default下面的文件夹,这个里面是皮肤,共有三种,可以在fckconfig.js里面设置。

 

 

 

分享到:
评论

相关推荐

    FCK使用

    标题"FCK使用"指的是FCKeditor的使用教程或经验分享,FCKeditor是一个曾经非常流行的开源HTML文本编辑器,常用于网站内容管理系统中,让用户能够像在Word中一样编辑网页内容。这篇博客文章可能详细介绍了如何集成、...

    FCK编辑器使用手册

    #### 一、FCK编辑器简介与常见问题解决 FCK编辑器是一款广泛应用于Web开发领域的富文本编辑器,它提供了强大的编辑功能,能够帮助开发者快速构建出具备丰富文本处理能力的应用系统。然而,在实际使用过程中,可能会...

    FCK在asp.net和MVC中的使用实例(含源文件)

    **FCK编辑器在ASP.NET和MVC中的应用** FCKeditor是一款强大的开源富文本编辑器,它允许用户在Web页面上进行类似Word的文本编辑操作。在ASP.NET和MVC框架下,集成FCKeditor可以提升用户体验,使得内容创建和编辑更为...

    Fck编辑器基本使用.doc

    #### 一、Fck编辑器简介 Fck编辑器是一款开源的富文本编辑器,广泛应用于Web应用程序中,为用户提供了一个接近桌面编辑器的体验。它支持多种格式的文本编辑,并且可以轻松地嵌入到网页中。 #### 二、安装与配置步骤...

    FCK插件使用说明(pdf版)原创 绝对精品

    #### 一、FCK简介 FCK是一款非常强大的客户端文本编辑工具,它能够提供类似于Microsoft Word的功能,使得用户在网页上也能轻松地编辑富文本内容。本版本为2.6.3,包含了完整的DLL文件,方便开发者直接集成到项目中...

    fck编辑器使用手册

    ### FCK Editor 简介 FCK Editor(现称 CKEditor)是一款非常强大且流行的富文本编辑器,它允许用户通过直观的界面进行 HTML 内容的编辑。FCK Editor 的功能丰富,支持图片上传、表格处理等多种高级特性,并且可以...

    FCK 使用指南.doc

    #### 一、FCKEditor简介 FCKeditor是一款功能强大且易于使用的HTML文本编辑器,它为Web应用程序提供了类似于桌面编辑器MS Word的强大编辑功能。这款编辑器的设计目标是轻量级和易用性,用户无需进行复杂的安装过程...

    fck上传等功能不能使用(fck和ie9的问题)

    ### fck上传等功能不能使用(fck和ie9的问题) #### 概述 在使用FCKeditor时,可能会遇到在Internet Explorer 9 (IE9) 浏览器中某些功能无法正常工作的情况,例如文件上传功能。这主要是由于IE9与FCKeditor之间...

    FCK在线编辑器使用说明

    #### 一、FCK在线编辑器简介与功能 FCK在线编辑器是一款强大的富文本编辑工具,它能够提供类似桌面应用的编辑体验,适用于网页开发,允许用户直接在浏览器中编辑和格式化文本。FCK在线编辑器支持多种格式的插入,...

    FCK编辑器使用帮助

    #### 一、FCK编辑器简介 FCK编辑器是一款流行的Web编辑器,广泛应用于网站内容管理系统的编辑界面。它提供了丰富的编辑功能,能够帮助用户轻松创建和编辑HTML文档。本文档将详细介绍FCK编辑器的各项功能,帮助您更好...

    jsp中fck的使用

    **JSP中FCK编辑器的使用详解** FCKeditor是一款功能强大的开源文本编辑器,常用于网页开发,尤其在JSP(Java Server Pages)环境中,它可以为用户提供类似Word的富文本编辑体验,使得用户在网页上进行内容编辑时...

    Java FCK配置和使用

    1. **FCKeditor简介** FCKeditor是一款开源的JavaScript富文本编辑器,它提供了一个类似Microsoft Word的界面,让用户在网页上进行文本格式化、插入图片、链接等操作。Java FCK配置主要是将编辑器集成到Java Web...

    FCK editor 使用实例代码

    1. **FCKeditor 简介** FCKeditor是基于JavaScript编写的一个在线文本编辑器,它可以提供类似于Microsoft Word的编辑体验,支持图片上传、表格处理、超链接创建等功能。它与服务器端语言如PHP、ASP.NET、Java等紧密...

    Grails使用FCK Editor实例(附源码和文档)

    FCK Editor简介** FCK Editor是一款JavaScript实现的在线富文本编辑器,它支持多种浏览器,并提供了丰富的编辑功能,如字体、颜色、链接、图片上传等。通过在网页中嵌入FCK Editor,用户可以像使用桌面文字处理软件...

    .Net中Fck用法详解(带fck)

    一、FCKeditor简介 FCKeditor是一款基于JavaScript的开源富文本编辑器,它提供了丰富的文本格式化功能,如字体、字号、颜色、对齐方式等,并支持图片、链接、表格、列表等元素的插入。在.NET环境下,我们可以借助...

    FCK在线编辑器 JSP

    **FCK在线编辑器 JSP** 是一个基于Web的富文本编辑器,它允许用户在浏览器端进行文本格式化、图像上传以及其他常见的文档编辑操作。FCKeditor在JSP(JavaServer Pages)环境下使用,可以极大地提升网页内容创建的...

    FCK使用教材

    **FCK编辑器详解** FCKeditor是一款曾经广泛使用的开源HTML文本编辑器,它使得在网页上创建富文本内容变得更加简单。本教材将全面讲解FCKeditor的安装、配置、使用方法,以及针对中文乱码问题的解决方案。 **一、...

    fck的例子

    **FCKeditor简介** FCKeditor是一款开源的Web富文本编辑器,广泛应用于网页和Web应用程序中,允许用户在浏览器端进行文字编辑、格式化、插入图片、链接等操作,类似于桌面应用程序中的Word编辑功能。它由Fernando ...

    flex_fck_editor 例子

    一、Flex_FCK_Editor简介 Flex_FCK_Editor是基于FCKeditor的Flex版本,FCKeditor是一款流行的JavaScript富文本编辑器。Flex_FCK_Editor充分利用了Flex的图形用户界面和RIA(Rich Internet Application)特性,提供...

    FCK使用配置

    #### 一、FCKeditor简介 FCKeditor是一款非常实用的在线富文本编辑器,它能够提供类似于Microsoft Word的强大编辑功能,极大地提升了Web应用程序的用户体验。FCKeditor是开源项目,可以在官方网站(...

Global site tag (gtag.js) - Google Analytics