FCKeditor 网页在线编辑器的使用方法

它不需要安装任何形式的客户端,兼容绝大多数主流浏览器,支持ASP.Net、ASP、ColdFusion 、PHP、Jsp、Active-FoxPro、Lasso、Perl、ython 等编程环境。

官方网站 http://www.fckeditor.net/

官方文档 http://wiki.fckeditor.net/

下载地址 http://www.fckeditor.net/download/default.html

FCKeditor安装和配置

下载FCKeditor2.63.zip和FCKeditor.NET2.63版的2个zip包

(a)   FCKeditor_2.6.3是html文件、Javascript文件和图片等资源文件

(b)   FCKeditor.Net_2.6.3.zip是一个ASP.NET控件DLL文件 

Asp.Net项目中添加对 FCKeditor 的引用

1. 项目上选择添加引用找到FredCK.FCKeditorV2.dll或直接将FredCK.FCKeditorV2.dll复制到项目的Bin目录中

2. 为了方便开发,可以把FredCK.FCKeditorV2.dll控件也添加到VS的工具箱中

3. 配置Web.Config,在<appSettings>节点添加,如下所示:

<appSettings>

<!--FCKeditor文本编辑控件配置-->

<add key="FCKeditor.BasePath" value="~/FCKeditor/"/>

<add key="FCKeditor.UserFilesPath" value="/解决方案名/uploads"/> //UserFilesPath的文路径可以在FCKeditor/editor/filemanager/connectors/aspx/config.ascx中更改

</appSettings>
4.网页中使用
<FCKeditorV2:FCKeditor ID="FCKeditor" runat="server" BasePath="~/FCKeditor/">//BasePath指定到FCKeditor的根目录
</FCKeditorV2:FCKeditor>


FCKeditor 的配置:

进入FCKeditor文件夹,编辑 fckconfig.js 文件

1、修改(改成自己当前使用的语言)

var _FileBrowserLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py

var _QuickUploadLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py

2、修改配置语言

FCKConfig.DefaultLanguage = ‘en'  为: FCKConfig.DefaultLanguage = ‘zh-CN' ;

3、配置皮肤,有default、office2003、silver风格等。

FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ;

4、在编辑器域内可以使用Tab键。(1为是,0为否)

FCKConfig.TabSpaces = 0 ; 改为 FCKConfig.TabSpaces = 1 ;

5、加上几种常用的字体:

FCKConfig.FontNames = ‘宋体;黑体;隶书;楷体_GB2312;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana';

6、编辑器域内默认的显示字体为12px,想要修改可以通过修改样式表来达到要求,打开/editor/css/fck_editorarea.css,修改font-size属性即可

7、关于安全性

如果你的编辑器用在前台非认证的情况下,推荐使用Basic的toolbar

FCKConfig.ToolbarSets["Basic"] = [

  ['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink','Image','-','About']

] ;

8、在上传文件窗口点击浏览服务器,可能会出现 the server didn't send back a proper xml….. 错误提示,是因为FCKeditor要求不同类型的文件分别传到不同的目录,包括file,image,falsh,media 等目录,可以先建立起来试试。



FCKEditor.NET 2.6 的安全性配置

文件上传,出错:(This connector is disabled.please check the "editor/filemanager/connectors/aspx/config.ascx" file.)

打开 editor/filemanager/connectors/aspx/config.ascx 文件,返回true.



代码如下:

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;
}

FCKeditor的精简和清理
进入FCKeditor文件夹,将所有以“_”开头的文件和文件夹删,删除FCKeditor文件夹下后缀名为:.afp、.cfc、.cfm、.lasso、.pl、.py、.txt文件,只保留FCKeditor文件夹下fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml就可以了;
进入editor文件夹,删掉“_source”文件夹,里面放的同样是源文件;
lang里面放的是语言包,如果只是用简体中文,那么只保留fcklanguagemanager.js、zh-cn.js两个文件就OK,建议保留en.js(英文)、zh.js(繁体中文)两个文件,fcklanguagemanager.js是语言配置文件,有了它才能和 fckconfig.js里的设置成对,对应上相应的语言文件,一定要保留!
简单介绍一下配置文件fckconfig.js中文注释。如有理解错误的地方请高手留言指正。
FCKConfig.CustomConfigurationsPath = '' ; //自定义配置文件路径和名称
FCKConfig.EditorAreaCSS = FCKConfig.BasePath + 'css/fck_editorarea.css' ; //文本编辑区域的样式表文件路径

FCKConfig.EditorAreaStyles = '' ; //文本编辑区域的样式表风格
FCKConfig.ToolbarComboPreviewCSS = '' ; //工具栏预览CSS
FCKConfig.DocType = '' ; //文档类型
FCKConfig.BaseHref = '' ; //相对链接的基地址
FCKConfig.FullPage = false ; //是否允许编辑整个HTML文件,还是仅允许编辑BODY间的内容
FCKConfig.StartupShowBlocks = false ; //是否启用"显示模块"
FCKConfig.Debug = false ; //是否开启调试窗口功能
FCKConfig.AllowQueryStringDebug = true ; //是否启用网页查询调试功能
FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ; //FCKeditor皮肤路径
FCKConfig.SkinEditorCSS = '' ; //编辑器的皮肤CSS路径
FCKConfig.SkinDialogCSS = '' ; //对话窗口的皮肤CSS路径
FCKConfig.PreloadImages = [ FCKConfig.SkinPath + 'images/toolbar.start.gif', FCKConfig.SkinPath + 'images/toolbar.buttonarrow.gif' ] ;
//预装入的图片

FCKConfig.PluginsPath = FCKConfig.BasePath + 'plugins/' ; //插件路径
FCKConfig.AutoGrowMax = 400 ;
//文本编辑区域允许自动增长的最大高度限制,设置此属性时应同时将
// FCKConfig.Plugins.Add( 'autogrow' ) ;属性的注释去除,配合使用
FCKConfig.AutoDetectLanguage = true ; //是否自动检测语言
FCKConfig.DefaultLanguage = 'en' ; //默认语言
FCKConfig.ContentLangDirection = 'ltr' ; //默认的文字方向,可选"ltr/rtl",即从左到右或从右到左
FCKConfig.ProcessHTMLEntities = true ; //处理HTML实体
FCKConfig.IncludeLatinEntities = true ; //包括拉丁文
FCKConfig.IncludeGreekEntities = true ; //包括希腊文
FCKConfig.ProcessNumericEntities = false ; //处理数字实体
FCKConfig.AdditionalNumericEntities = '' ; //附加的数字实体
FCKConfig.FillEmptyBlocks = true ; //是否填充空块
FCKConfig.FormatSource = true ; //在切换到代码视图时是否自动格式化代码
FCKConfig.FormatOutput = true ; //当输出内容时是否自动格式化代码
FCKConfig.FormatIndentator = ' ' ; //当在源码格式下缩进代码使用的字符
FCKConfig.EMailProtection = 'none' ; //侦测电子邮件链接
FCKConfig.EMailProtectionFunction = 'mt(NAME,DOMAIN,SUBJECT,BODY)' ; //侦测电子邮件链接
FCKConfig.StartupFocus = false ; //开启时焦点是否到编辑器,即打开页面时光标是否停留在fckeditor上
FCKConfig.ForcePasteAsPlainText = false ; //是否强制粘贴为纯文本内容
FCKConfig.AutoDetectPasteFromWord = true ; //是否自动探测从word粘贴文件,仅支持IE
FCKConfig.ShowDropDialog = true ; //是否显示下拉菜单
FCKConfig.ForceSimpleAmpersand = false ; //是否不把&符号转换为XML实体
FCKConfig.TabSpaces = 0 ; //按下Tab键时光标跳格数,默认值为零为不跳格
FCKConfig.ShowBorders = true ; //是否合并边框
FCKConfig.SourcePopup = false ; //是否弹出
FCKConfig.ToolbarStartExpanded = true ; //启动FCKeditor工具栏默认是否展开
FCKConfig.ToolbarCanCollapse = true ; //是否允许折叠或展开工具栏
FCKConfig.IgnoreEmptyParagraphValue = true ; //是否忽略空的段落值
FCKConfig.FloatingPanelsZIndex = 10000 ; //浮动面板索引
FCKConfig.HtmlEncodeOutput = false ; //是否将HTML编码输出
FCKConfig.TemplateReplaceAll = true ; //是否替换所有模板
FCKConfig.TemplateReplaceCheckbox = true ; //是否将实际内容显示在模版窗口中
FCKConfig.ToolbarLocation = 'In' ; //工具栏位置
FCKConfig.ToolbarSets["Default"] //配置默认工具栏中各按钮,适合用于后台编辑
FCKConfig.ToolbarSets["Basic"] //配置基本工具栏按扭,适合前台编辑
FCKConfig.EnterMode = 'p' ; //编辑文本时按回车键自动生成<P></P>标签
FCKConfig.ShiftEnterMode = 'br' ; ////编辑文本时按Shift+回车键自动生成<br />标签
FCKConfig.Keystrokes //自定义键盘快捷键
FCKConfig.ContextMenu //定义右键菜单的内容
FCKConfig.BrowserContextMenuOnCtrl = false ; //是否允许在编辑区域中当按下Ctrl键时,点击鼠标右键显示浏览器的上下文菜单
FCKConfig.BrowserContextMenu = false ; //是否允许在编辑区域中点击鼠标右键显示浏览器的上下文菜单
FCKConfig.EnableMoreFontColors = true ; //是否禁止更多颜色选项
FCKConfig.FontColors //文字颜色列表
FCKConfig.FontFormats //文字格式列表
FCKConfig.FontNames //字体列表
FCKConfig.FontSizes //字号列表
FCKConfig.StylesXmlPath = FCKConfig.EditorPath + 'fckstyles.xml' ; //CSS样式列表的XML文件的位置
FCKConfig.TemplatesXmlPath = FCKConfig.EditorPath + 'fcktemplates.xml' ; //模版的XML文件位置
FCKConfig.SpellChecker = 'WSC' ; //拼写检查器
FCKConfig.IeSpellDownloadUrl = 'http://www.iespell.com/download.php' ; //下载拼写检查器的网址
FCKConfig.SpellerPagesServerScript = 'server-scripts/spellchecker.php' ; //拼写检查器脚本路径
FCKConfig.FirefoxSpellChecker = false ; //Firefox浏览器拼写检查
FCKConfig.MaxUndoLevels = 15 ; //最大可以撤销的次数
FCKConfig.DisableObjectResizing = false ; //是否禁止用户调整图像和表格的大小
FCKConfig.DisableFFTableHandles = true ; //是否禁用表格工具
FCKConfig.LinkDlgHideTarget = false ; //是否隐藏Link窗口的target标签
FCKConfig.LinkDlgHideAdvanced = false ; //是否隐藏Link窗口的advanced标签
FCKConfig.ImageDlgHideLink = false ; //是否隐藏image窗口的link标签
FCKConfig.ImageDlgHideAdvanced = false ; //是否隐藏image窗口的advanced标签
FCKConfig.FlashDlgHideAdvanced = false ; //是否隐藏Flash窗口的advanced标签
FCKConfig.ProtectedTags = '' ; //添加HTML套用格式
FCKConfig.BodyId = '' ; //设置编辑器的id
FCKConfig.BodyClass = '' ; //设置编辑器的class
FCKConfig.DefaultStyleLabel = '' ; //设置文本编辑器的风格,默认为空白文档
FCKConfig.DefaultFontFormatLabel = '' ; //设置默认格式
FCKConfig.DefaultFontLabel = '' ; //设置默认字体
FCKConfig.DefaultFontSizeLabel = '' ; //设置默认字体大小
FCKConfig.DefaultLinkTarget = '' ; //设置默认链接目标为(_blank、_self _parent、_top)
FCKConfig.CleanWordKeepsStructure = false ; //是否设置直接粘贴为Word格式
FCKConfig.RemoveFormatTags //删除文字时是否删除相应的格式
FCKConfig.RemoveAttributes //删除文字时是否删除相应的样式
FCKConfig.CustomStyles //样式菜单
FCKConfig.CoreStyles //设置FCKeditor核心样式
FCKConfig.IndentLength = 40 ; //编辑器中缩进量的长度
FCKConfig.IndentUnit = 'px' ; //编辑器中缩进量的单位
FCKConfig.IndentClasses = [] ; //FCKeditor允许使用CSS缩进
FCKConfig.JustifyClasses = [] ; //FCKeditor允许使用CSS类文本
var _FileBrowserLanguage = 'php' ; //文件浏览器使用的语言
var _QuickUploadLanguage = 'php' ; //快速上传使用的语言
var _FileBrowserExtension = _FileBrowserLanguage == 'perl' ? 'cgi' : _FileBrowserLanguage ; //文件浏览器扩展
var _QuickUploadExtension = _QuickUploadLanguage == 'perl' ? 'cgi' : _QuickUploadLanguage ; //快速上传扩展
FCKConfig.LinkBrowser = true ; //是否允许在插入链接时浏览服务器
FCKConfig.LinkBrowserURL //插入链接时浏览服务器的URL
FCKConfig.LinkBrowserWindowWidth //链接目标浏览器窗口宽度
FCKConfig.LinkBrowserWindowHeight //链接目标浏览器窗口高度
FCKConfig.ImageBrowser = true ; //是否关闭图片文件浏览服务器的功能
FCKConfig.ImageBrowserURL //图片文件浏览服务器的URL
FCKConfig.ImageBrowserWindowWidth //图像浏览器窗口宽度
FCKConfig.ImageBrowserWindowHeight //图像浏览器窗口高度
FCKConfig.FlashBrowser = true ; //是否关闭Flash浏览服务器的功能
FCKConfig.FlashBrowserURL //Flash浏览服务器的URL
FCKConfig.FlashBrowserWindowWidth //Flash浏览器窗口宽度
FCKConfig.FlashBrowserWindowHeight //Flash浏览器窗口高度
FCKConfig.LinkUpload = true ; //是否开启文件上传的功能
FCKConfig.LinkUploadURL //指定默认上传文件的地址
FCKConfig.LinkUploadAllowedExtensions //设置允许上传文件的扩展名
FCKConfig.LinkUploadDeniedExtensions = "" ; //设置允许上传脚本文件的扩展名
FCKConfig.ImageUpload = true ; //是否开启图片上传功能
FCKConfig.ImageUploadURL //指定默认上传图片文件的地址
FCKConfig.ImageUploadAllowedExtensions //设置允许上传图片文件的扩展名
FCKConfig.ImageUploadDeniedExtensions = "" ; //设置允许上传图片脚本文件的扩展名
FCKConfig.FlashUpload = true ; //是否开启Flash上传功能
FCKConfig.FlashUploadURL //Flash上传文件的地址
FCKConfig.FlashUploadAllowedExtensions //设置允许上传Flash文件的扩展名
FCKConfig.FlashUploadDeniedExtensions = "" ; //设置允许上传Flash脚本文件的扩展名
FCKConfig.SmileyPath //插入表情图标的路径
FCKConfig.SmileyImages //表情图标的文件名称
FCKConfig.SmileyColumns = 8 ; //表情窗口显示表情列数
FCKConfig.SmileyWindowWidth = 320 ; //表情窗口显示宽度,此窗口会因为表情文件的改变而作调整
FCKConfig.SmileyWindowHeight = 210 ; //表情窗口显示高度,此窗口会因为表情文件的改变而作调整
FCKConfig.BackgroundBlockerColor = '#ffffff' ; //编辑器弹出窗口时,背景遮照住的颜色
FCKConfig.BackgroundBlockerOpacity = 0.50 ; //编辑器弹出窗口时,背景遮照住的透明度
FCKConfig.MsWebBrowserControlCompat = false ;
FCKConfig.PreventSubmitHandler = false ;

(0)

相关推荐

  • 页面上存在多个FckEditor编辑器的验证方法

    有时我们需要在一个页面上使用多个Fck的实例,首先需要按照id获取fck的实例.例如: 复制代码 代码如下: <FCKeditorV2:FCKeditor ID="fckDescription" runat="server" ToolbarSet="Basic" Height="250"> </FCKeditorV2:FCKeditor> 使用FCKeditorAPI.GetInstance获取Fck实

  • javascript fckeditor编辑器取值与赋值实现代码

    获取编辑器中HTML内容 复制代码 代码如下: function getEditorHTMLContents(EditorName) { var oEditor = FCKeditorAPI.GetInstance(EditorName); return(oEditor.GetXHTML(true)); } 获取编辑器中文字内容 复制代码 代码如下: function getEditorTextContents(EditorName) { var oEditor = FCKeditorAPI.G

  • Js FCKeditor的值获取和修改的代码小结

    利用Javascript取和设FCKeditor值也是非常容易的,如下: // 获取编辑器中HTML内容 function getEditorHTMLContents(EditorName) { var oEditor = FCKeditorAPI.GetInstance(EditorName); return(oEditor.GetXHTML(true)); } // 获取编辑器中文字内容 function getEditorTextContents(EditorName) { var oEd

  • javascript 获取FCKeditor内容

    形式如: 复制代码 代码如下: varoEditor=FCKeditorAPI.GetInstance('content'); varcontent=oEditor.GetXHTML(true); ************************************************* 利用Javascript取和设FCKeditor值也是非常容易的,如下: 复制代码 代码如下: // 获取编辑器中HTML内容 function getEditorHTMLContents(Editor

  • FCKeditor 编辑器插入代码功能实现步骤

    功能强大得不得了,可以插入的语言包括:C/C++,XML/HTML,JavaScript,CSS,C#,Java,PHP,Python,Ruby,SQL,ASP/Visual Basic,可选择在前台显示语言名称.显示行号.是否允许折叠等功能,而且还有语法着色功能,比你想像的还要完美.而且可分为以文本域显示代码和有运行按钮的可执行方式显示.特向大家分享! 安装方法如下: 1.下载压缩包后,将文件夹insertcode拷贝到fckeditor\editor\plugins\目录下,然后修改fcke

  • FCKEditor网页编辑器 几点使用心得

    1.挂接事件,比如onkeydown事件,要在FCKeditor_OnComplete里实现: 复制代码 代码如下: function FCKeditor_OnComplete( editorInstance ) { if (document.all) // IE editorInstance.EditorDocument.attachEvent("onkeypress", FCKeditor_OnKeyup) ; else// other browser editorInstance

  • FCKeditor 网页在线编辑器的使用方法

    它不需要安装任何形式的客户端,兼容绝大多数主流浏览器,支持ASP.Net.ASP.ColdFusion .PHP.Jsp.Active-FoxPro.Lasso.Perl.ython 等编程环境. 官方网站 http://www.fckeditor.net/ 官方文档 http://wiki.fckeditor.net/ 下载地址 http://www.fckeditor.net/download/default.html FCKeditor安装和配置 下载FCKeditor2.63.zip和F

  • ASP FCKeditor在线编辑器使用方法

    本文使用的是最新的FCKeditor 2.3.1版本 官方网站下载: http://ckeditor.com/download[建议直接在官方网站下载最新版本] 下面就开始用了: 第一项工作就是对这个功能宏大的编辑器进行精简,当然是文件精简而非功能精简化.在这里我以asp版的FCKeditor为例进行,进入到FCKeditor 文件夹下,先把以"_"为开头的文件夹统统删除,这些文件夹里放的是范例或是一些其它工具.其实也就是只保留editor文件夹.fckconfig.js.fckedi

  • ASP下使用FCKeditor在线编辑器的方法

    先说一下我的测试环境:XPSP2,IIS5.1,FCKeditor2.0 在IIS上建立一个新的站点,我直接取名为FCKeditor 在DW里建立一个相对应的站点,测试服务器为本机,支持VBScript 下载FCKeditor2.0,这个东西是开源的,网上能下到的地方很多,自己找去-- 下载下来的应该是压缩包,解压到FCKeditor站点根目录,什么都不需要更改,直接就可以开始调用了.等你会了的时候,会发现简单得要死去! 在站点根目录下,新建一个index.asp页面,段内加如下代码(调用编辑器

  • 网页编辑器FCKeditor 2.6.4精简配置方法

    上传目录请在fckeditoreditorfilemanagerconnectorsaspconfig.asp中设置 Dim ConfigUserFilesPathConfigUserFilesPath = "/userfiles/" 中文配置说明:因为下载下来的压缩包里面有包含很多在我们使用时,用不到的,不删除也行.看个人喜好下面以PHP为例,进行程序瘦身 删除所有"_"开头的文件和文件夹 删除FCKeditor的目录下: fckeditor.afpfckedit

  • ThinkPHP中FCKeditor编辑器的使用方法

    而且可以用直接上传和ajax两种方式处理内容.为了给一些还没能成功地集成fckeditor的同侪们一些启发与帮助, 兹将我的经验与体会描述如下:应用目的:将FCKeditor编辑器集成到Thinkphp中,使用户能够在线像编辑Word一样处理即将发表的文字与图像. 应用软件与环境:apache服务器2.0以上版本,PHP版本5.0以上,mysql5.0以上:Thinkphp版本1.5或以上,Fckeditor版本2.x. 应用步骤: 1.下载FCKeditor2.x版本,将解压后的文件夹FCKe

  • ASP.NET中FCKEDITOR在线编辑器的用法

    你可以将FCKEDITOR放置到任何文件夹,默认情况下,将其放入到FCKEDITOR文件夹是最为简单的方法.如果你放入的文件夹使用别的名称,请修改配置文件夹中编辑器BasePath参数,如下所示: oFckeditor.BasePath="/Components/fckeditor/"; 另外,FCKEDITOR文件夹中所有以下划线开头的文件夹及文件,都是可选的,可以安全的从你的发布中删除.它们并不是编辑器运行时必需的 如何将FCKEDITOR整合进我的页面? 由于目前的版本提供的FC

  • php下FCKeditor2.6.5网页编辑器的使用方法

    1.首先去官网下载FCKeditor2.6.5 多国语言版.http://ckeditor.com/download,注意:第一个为最新3.0.1版,第二个才是FCKeditor 2.6.5 2.删除不必要的东西: 删除/FCKeditor/目录下除fckconfig.js,fckeditor.js,fckstyles.xml,fcktemplates.xml,fckeditor.php,fckeditor_php5.php,fckeditor_php4.php 七个文件以外的所有文件: 删除目

  • JS网页在线获取鼠标坐标值的方法

    本文实例讲述了JS网页在线获取鼠标坐标值的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>显示鼠标坐标</title> </head> <body onMousemove="m

  • 22个国外的Web在线编辑器收集

    1. TinyMCE 免费,开源,轻量的在线编辑器,基于 javascript,高度可定制,跨平台. 2. FCKEditor 免费,开源,用户量庞大的在线编辑器,有良好的社区支持. 3. YUI Editor 属于 Yahoo! YUI 的一部分,能输出纯净 Xhtml 代码. 4. NicEdit 简单,易用,轻量,外观漂亮的在线编辑器. 5. Kupu 开源,支持 ajax 保存,跨平台,易于集成,由 OSCOM 推出. 6. Free Rich Text Editor 非常容易部署,输出

  • JSP实用教程之简易页面编辑器的实现方法(附源码)

    前言 实现一个简易的页面编辑器是大家在学习jsp的时候经常会遇到的一个需求,发现网上这方便的资料不多,所以想着自己总结下,本文详细介绍了JSP简易页面编辑器的实现方法,下面话不多说,来一起看看详细的介绍: 需求 提供一页面,放置"帮助"."版权"文字内容,特点:静态页面,无须读数据库,只是应付字眼上频繁的修改:没有复杂的交互,无须 JavaScript:没有图片,不需要文件上传. 给出的方案:提供一页面和简易的后台管理,功能单一,只是编辑页面(只是修改字体.大小.粗

随机推荐