对于ASP网 站,FCKeditor可以直接拿过来用了,不需要进行什么修改,因为FCKeditor默认就是ASP的。
一、准备工作
首先下载FCKeditor V2.6.4,这个核心文件叫FCKeditor_2.6.4.zip,下载地址: http://www.fckeditor.net/download/default.html这 个压缩包里并不包含ASP.NET要用到的DLL控件,所以还要下载另外一个压缩包,下载地址: http://sourceforge.net/project/showfiles.php?group_id=75348&package_id=137125, 全名叫FCKeditor.NET_2.6.3.zip。把第一个文件解压到WEB根目录,默认文件夹名为:FCKeditor;再把第二个包解压,里面 包含了源代码,如果你想自己再次开发,可以双击FredCK.FCKeditorV2.csproj文件,打开VS.NET进行修改,所用的语言是C#; 不想修改的话,直接把bin\Release下面的FredCK.FCKeditorV2.DLL文件拷到WEB目录的bin下面,具体位置是 FCKeditor.Net_2.6.3/bin/release/FredCK.FCKeditorV2.dll。并且在根目录下新建uploads目 录用来存放编辑器上传得文件。
二、精简文件
因为只用到ASP.NET,所以有必要精简一 下文件。
进入FCKeditor文件夹,把所有“_”开头的文件和文件夹删掉,这些都是一些范例,只保留editor文件夹、 fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml就可以了;
进入 editor文件夹,删掉“_source”文件夹,里面放的同样是源文件;
退回上一级目录进入filemanager文件夹,有 browser和connectors两个文件夹。进入connectors,只保留aspx文件夹,其余的删掉;mcpuk目录亦可删除;upload 也一样,只保留aspx文件夹;
退到editor再进入images文件夹,smiley里面放的是表情图标,有msn一个系列,如果你想 用自己的表情图标,可以把它们都删除;如果你想用这里的表情图标那就不要删了;
lang里面放的是语言包,如果只是用简体中文,那么只保留 zh-cn.js两个文件就行了,建议也保留en.js(英文)、zh.js(繁体中文)两个文件.
再退出lang文件夹,进入skins 文件夹,如果你想使用FCKeditor默认的奶黄色,那就把除了default文件夹外的另两个文件夹直接删除,如果想用别的,那就看你自己的喜好了。
三、修改设置
1.打开位于根目录下的fckconfig.js文件,更改控件皮肤FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ;这行是设置皮肤的,如果精简时只保留了silver,就把路径改成skins/silver,默认就不用管它了;
2.打开位于根目录下的fckconfig.js文件
修改 FCKConfig.DefaultLanguage = 'en';
var _FileBrowserLanguage = 'asp';//asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'asp';//asp | aspx | cfm | lasso | php
改为 FCKConfig.DefaultLanguage = 'zh-cn'; var _FileBrowserLanguage = 'aspx';//asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'aspx';//asp | aspx | cfm | lasso | php
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.编辑区域内默认的显示字体是12px,想要修改可以通过修改样式表来达到要求,打开/editor/css/fck_editorarea.css, 修改font-size属性即可。
5. 关于安全性
如 果你的编辑器用在网站前台的话,那就不得不考虑安全了,在前台千万不要使用Default的toolbar,要么自定义一下功能,要么就用系统已经定义好 的Basic,也就是基本的toolbar。
改过的 Basic,要把图像功能,添加链接功能,flash,图像按钮添加功能去掉,这些都能让前台页直接访问和上传文件,要是这儿不改直接给你上传个木马还不 马上玩完?
6.FCKConfig.AutoDetectLanguage = true ;FCKConfig.DefaultLanguage = 'en' ;
设置默认语言,把en改成zh-cn,即简体中文;把 AutoDetectLanguage 设置成false;
7.FCKConfig.TabSpaces = 0;如果在编辑过程中要用到TAB键,就把0改成1;
8. 修改上传文件的默认位置 在FCKeditor中默认上传位置是/UserFiles/, 怎样修改到自己的目录下呢? 可以修改在web.config中加上
<appSettings>
<add key="FCKeditor:BasePath" value="~/FCKeditor/"/>
<add key="FCKeditor:UserFilesPath" />
</appSettings>
就可以了,你也可以再upload 中再建一些子目录,比如flash,media,image,File等。
设置了FCKeditor:BasePath后就不用再每 次使用FCKeditor实例时指定BasePath属性了,FCKeditor:UserFilesPath则是制定我们所有上传的文件的所在目录。你 也许会问为什么要设置成/MyBlog/uploads 这样而不是~/uploads,因为FCKeditor使用这个值来返回你上传后的文件的相对路径到客户端,~/uploads的形式是ASP.NET在 服务可以编译解释的,但是在客户端的静态就不懂这是什么了。如果使用~/uploads后,那么所有上传文件的返回路径都是~/uploads形式的,你 就会得到这样的链接http://~/uploads/Image/logo.gif这样的链接解果就是路径为找到。所以才要我们上述那样设置,这是在开 发阶段,如果在工程完成后发布时请记住把/test/uploads改成/uploads,道理不说大家也明白,开发阶段VS2005在运行项目时的 URL是http://localhost/项 目名称/的形式,发布后在Server上建立站点,跟路径就是http://www.abc.com/的形式了,所以发布后一定要改过来。这些地方是在使 用FCKeditor2.6.3+ASP.NET2.0时经常发错误而又莫名其所云的地方。
四、ASP.NET中的应用
打开项目的“资源管理器”,在Bin文件夹下添加“FredCK.FCKeditorV2”引用,会多出 FredCK.FCKeditorV2.dll和FredCK.FCKeditorV2.pdb两个文件。下面以“添加文章”为例,打开添加文章、管理文 章相对应的文件以修改其中的内容。切换到“HTML”界面,添加FCK的引用,代码如下:
<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" %>
并确保@ Page中的“AutoEventWireup”“validateRequest”两个值都为false,不然当你发表的文章中含有链接或是其他 HTML语句时,.NET会警告你有安全隐患而出错。在form的适当位置加入FCKeditor控件,当然form一定要有 “runat="server"”,代码如下:
<fckeditorv2:fckeditor id="FCKeditor" runat="server" Width="580px" EnableXHTML="true" EnableSourceXHTML="true" basepath="~/FCKeditor/" height="500px"></fckeditorv2:fckeditor>
id可以自己命名,自己喜欢易记就行。如 果程序中有检测输入是否为空的话,那么就不再是content.Text了,而是content.Value。
至此,文件修改完毕。所有代码如 下:
<%@ Page language="c#" Codebehind="AdminFileAdd.aspx.cs" AutoEventWireup="false" Inherits="MyBlog.Admin.AdminFileAdd" validateRequest="false"%>
<%@ Register TagPrefix="FCKeditorV2" Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>AdminFileAdd</title>
<LINK href="/admin.css" type="text/css" rel="stylesheet">
</HEAD>
<body class="right">
<form id="Form1" method="post" runat="server">
<div>添加文章</div>
<div class="main">
<ul>
<li>
标题:<asp:textbox id="title" runat="server" MaxLength="50" Width="250px"></asp:textbox>
<li>
栏 目:<asp:dropdownlist id="m" runat="server" AutoPostBack="True"></asp:dropdownlist>
<li>
<FCKeditorV2:FCKeditor id="content" runat="server"></FCKeditorV2:FCKeditor>
<li>
<asp:button id="add" runat="server" Text="提 交"></asp:button>
</li>
</ul>
</div>
</form>
</body>
</HTML>
安装中的问题
1、如何取得编辑器中的文本。
该控件有个属性是value,它就是获得编辑器中的 文本的.
2.FCKeditor出现"this connector is disabled Please check the"editor/filemanager/connectors/aspx/config.aspx"错误的解决办法
解决办法:
打 开editor/filemanager/connectors/aspx/config.ascx修改CheckAuthentication()方 法,返回true
C# code
private bool CheckAuthentication()
{
// WARNING : DO NOT simply return "true". By doing so, you are allowing
// "anyone" to upload and list the files in your server. You must implement
// some kind of session validation here. Even something very simple as...
//
// return ( Session[ "IsAuthorized" ] != null && (bool)Session[ "IsAuthorized" ] == true );
//
// ... where Session[ "IsAuthorized" ] is set to "true" as soon as the
// user logs in your system.
return true;
}
为了安全性的考虑可以 在这里加入用户验证,根据用户权限,确定是否有权限上传文件。
3.官方网站的support上提到,如果使用asp.net 2.0和theme,那么需要打开\editor\filemanager\upload\aspx\upload.aspx和\editor \filemanager\browser\default\connectors\aspx\connector.aspx文件,并且在第一行中加入 Theme="" 。比如
程序代码
<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.FileBrowserConnector" AutoEventWireup="false" Theme="" %>
配置文件(fckconfig.js)中主要配置项目如下,根据自己看情况配置:
AutoDetectLanguage=true/false 自动检测语言
BaseHref="" 相对链接的基地址
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标记