FCKeditor_2.4.3的精简和使用

 FCKeditor的精简和使用其实网络已有很多的资料,但是介绍的不全或是不够详细。可能是我愚顿吧,反正我第一次使用FCKeditor的时候,就有这个感觉,所以这次我力求初次使用FCKeditor的朋友通过我这篇文章的介绍能够顺利是操作。
首先精简:
1.在 fckeditor文件夹中删除 _samples文件夹和.txt文件及.pl文件。
1.1.其实只要保留保留editor文件夹、fckconfig.js、fckeditor.asp、fckeditor.js、fckstyles.xml、fcktemplates.xml等文件就可以了(这是我在网看到的,自己使用时还是按(1))。
2.进入 editor文件夹后删除 _source文件夹,这里是一些源文件。
3.你可以打开image文件夹,删除 smiley文件,这里面存放的是表情图,如果你想使用自己的,可以替换。
4.打开 lang文件,只保留zh-cn.js、en.js、zh.js这三个js就OK。
5.打开 filemanager文件, browser/default/connectors 下面保留aspx文件。
6.打开filemanager文件,进入upload也只保留aspx文件。
至于skins文件夹里面是编辑器的外观,如有兴趣自己可以修改。
到此,精简已经完成了,下面介绍对原文件的一些修改:
fckconfig.js文件里的
FCKConfig.DefaultLanguage  = 'en' ;
改为:
FCKConfig.DefaultLanguage = ‘zh-cn’;
var _FileBrowserLanguage = 'asp' ; // asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'asp' ; // asp | aspx | cfm | lasso | php
修改为:
var _FileBrowserLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'aspx' ; // asp | aspx | cfm | lasso | php

FCKConfig.TabSpaces = 0 ; 改为FCKConfig.TabSpaces = 1 ; 即在编辑器域内可以使用Tab键。
接下来就是对上传图片路径的设置,
设置路径的前提是要确定,fckeditor文件在程序中的位置,一般情况是放在根目位置。

1、配置WebConfig,在<appSettings>节点添加,如下所示:

<appSettings>

    <add key="FCKeditor:BasePath" value="/项目名称/fckeditor/"/>

    <add key="FCKeditor:UserFilesPath" value="/项目名称/Files/" />

</appSettings>

BasePath是fckeditor所在路径
UserFilesPath是所有上传的文件的所在目录
至此对FCKeditor的操作已经全部完成了,还有就是在项目中对它的引用。
首先将FredCK.FCKeditorV2.dll添加到项目bin文件中,

 

一.文件夹说明

FCKeditor.Net_2.2          提供.NET组件

下载地址:http://nchc.dl.sourceforge.net/sourceforge/fckeditor/FCKeditor.Net_2.2.zip

FCKeditor_ 2.4.3 核心实现部分(包括一些重要的JS文件)

下载地址:http://downloads.sourceforge.net/fckeditor/FCKeditor_2.4.3.zip

 

二.VS2005中的部署

1 将该组件加入到工具栏中,将FCKeditor.Net_2.2文件夹BINFredCK.FCKeditorV2.dll文件拷贝到网站的BIN

 

2 将文件夹FCKeditor_ 2.4.3 下的fckeditor拷贝到网站工程主目录下

 

3 fckeditor/fckconfig.js进行设置:

先改FCK默认语言enzh-cnFCKConfig.DefaultLanguage  = 'en' ;替换为FCKConfig.DefaultLanguage  = 'zh-cn' ;

再改FCK默认上传使用的组件语言为aspx

var _FileBrowserLanguage = 'asp' ;

var _QuickUploadLanguage = 'asp' ;

替换为

var _FileBrowserLanguage = 'aspx' ;

var _QuickUploadLanguage = 'aspx' ;

 

4 打开webconifgxml, <appSettings>中设置两个键

1<add key="FCKeditor:BasePath" value=" fckeditor目录路径" />

注意点:在调试程序时,“fckeditor目录”设置为“/工程名/ fckeditor/”;

当上传到虚拟主机时,“fckeditor目录”设置为“fckeditor/

 

2<add key="FCKeditor:UserFilesPath" value="图片上传的存放路径" />

注意点:在调试程序时,“图片上传的存放路径”设置为“/工程名/图片相对路径”;

当上传到虚拟主机时,“图片上传的存放路径”设置为“/图片相对路径”;

(如果是改成“Files,则图片会保存到fckeditor/editor/filemanager/browser/default/connectors/aspx/Files/Image;

 

Example:

在本地机器调试时:

<add key="FCKeditor:BasePath" value="/MyProject/fckeditor/" />

<add key="FCKeditor:UserFilesPath" value="/ MyProject/Images/" />

在上传到虚拟主机时:

<add key="FCKeditor:BasePath" value="fckeditor/" />

<add key="FCKeditor:UserFilesPath" value="/Images/" />

 

3)在引用该控件的页面中ValidateRequest="false"

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FckDemo.aspx.cs" Inherits="FckDemo" ValidateRequest="false" %>

 

4官方网站的support上提到如果使用asp.net 2.0theme那么需要打开fckeditor/editor/filemanager/upload/aspx/upload.aspxfckeditor/editor/filemanager/browser/default/connectors/aspx/connector.aspx文件并且在第一行中加入Theme="" 。比如程序代码:
<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.FileBrowserConnector" AutoEventWireup="false"
Theme="" %>

三.文件的精简

上传到虚拟主机时,可以根据所使用的开发语言对fckeditor文件夹进行精简。这里使用ASP.NET

1进入fckeditor文件夹把所有“_”开头的文件和文件夹删掉这些都是一些范例只保留editor文件夹、fckconfig.jsfckeditor.jsfckstyles.xmlfcktemplates.xml就可以了
2进入editor文件夹删掉“_source”文件夹里面放的同样是源文件
3退回上一级目录进入filemanager文件夹browserupload两个文件夹。进入browser/default/connectors,只保留aspx文件夹,其余的删掉;mcpuk目录亦可删除;upload也一样,只保留aspx文件夹;
4)退到editor再进入images文件夹,smiley里面放的是表情图标,有msnfun两个系列,如果你想用自己的表情图标,可以把它们都删除;如果你想用这里的表情图标那就不要删了;
5lang里面放的是语言包,如果只是用简体中文,那么只保留fcklanguagemanager.jszh-cn.js两个文件就行了,建议也保留en.js(英文)、zh.js(繁体中文)两个文件,fcklanguagemanager.js是语言配置文件,有了它才能和fckconfig.js里的设置成对,对应上相应的语言文件,一定要保留!
6)再退出lang文件夹,进入skins文件夹,如果你想使用FCKeditor默认的奶黄色,那就把除了default文件夹外的另两个文件夹直接删除,如果想用别的,那就看你自己的喜好了。

四.控件的使用

使用Value属性获得文本内容(HTML格式的)

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
1.下载最新版的FCKEDITOR 2.解压缩到你的站点根文件夹中名为FCKEDITOR的文件夹中(名称必须为FCKEDITOR,因为配置文件中已经使用此名称来标示出FCKEDITOR的位置) 3.现在,编辑器就可以使用了,如果想要查看演示,可以按下面方法访问: http:///FCKeditor/_samples/default.html 注意:你可以将FCKEDITOR放置到任何文件夹,默认情况下,将其放入到FCKEDITOR文件夹是最为简单的方法.如果你放入的文件夹使用别的名称,请修改配置文件夹中编辑器BasePath参数,如下所示: oFckeditor.BasePath="/Components/fckeditor/"; 另外,FCKEDITOR文件夹中所有以下划线开头的文件夹及文件,都是可选的,可以安全的从你的发布中删除.它们并不是编辑器运行时必需的 如何将FCKEDITOR整合进我的页面? 由于目前的版本提供的FCKEDITOR仅提供了JAVASCRIPT式的整合,因此,这里仅讲述如何应用JAVASCRIPT来整合FCKEDITOR到站点中,当然,其他各种语言的整合,你可以参考_samples文件夹中的例子来完成 1,假如编辑器已经安装在你的站点的/FCKEDITOR/文件夹下.那么,第一步我们需要做的就是在页面的HEAD段中放入SCRIPT标记以引入JAVASCRIPT整合模块.例如: 其中路径是可更改的 2,现在,FCKEDITOR类已经可以使用了.有两个方法在页面中建立一个FCKEDITOR编辑器: 方法1:内联方式(建议使用):在页面的FORM标记内需要插入编辑器的地方置入以下代码: script type="text/javascript"> var oFCKeditor = new FCKeditor( 'FCKeditor1' ) ; oFCKeditor.Create() ; 方法2:TEXTAREA标记替换法(不建议使用):在页面的ONLOAD事件中,添加以下代码以替换一个已经存在的TEXTAREA标记 window.onload = function() { var oFCKeditor = new FCKeditor( 'MyTextarea' ) ; oFCKeditor.ReplaceTextarea() ; } This is the initial value. 3.现在,编辑器可以使用了 FCKEDITOR类参考: 下面是用来在页面中建立编辑器的FCKEDITOR类的说明 构造器: FCKeditor( instanceName[, width, height, toolbarSet, value] ) instanceName:编辑器的唯一名称(相当于ID) WIDTH:宽度 HEIGHT:高度 toolbarSet:工具条集合的名称 value:编辑器初始化内容 属性: instanceName:编辑器实例名 width:宽度,默认值为100% height:高度,默认值是200 ToolbarSet:工具集名称,参考FCKCONFIG.JS,默认值是Default value:初始化编辑器的HTML代码,默认值为空 BasePath:编辑器的基路径,默认为/Fckeditor/文件夹,注意,尽量不要使用相对路径.最好能用相对于站点根路径的表示方法,要以/结尾 CheckBrowser:是否在显示编辑器前检查浏览器兼容性,默认为true DisplayErrors:是否显示提示错误,默为true; 集合: Config[Key]=value; 这个集合用于更改配置中某一项的值,如 oFckeditor.Config["DefaultLanguage"]="pt-br"; 方法: Create() 建立并输出编辑器 RepaceTextArea(TextAreaName) 用编辑器来替换对应的文本框 如何配置FCKEDITOR? FCKEDITOR提供了一套用于定制其外观,特性及行为的设置集.主配置文件名为Fckconfig.js 你既可以编辑主配置文件,也可以自己定义单独的配置文件.配
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值