fckeditor配置
自定义配置方法
1.直接修改主配置文件fckconfig.js
fck主配置文件:fckeditor/fckconfig.js
2.定义单独的配置文件(只需要写需要修改的配置项)
2.1.创建myfckconfig.js配置自定义属性
将myfckconfig.js放入fckeditor/editor文件夹下,
- //系统是否自动检测并运用适当的语言界面
- FCKConfig.AutoDetectLanguage = false ;
- //手动设置默认的语言:法语
- FCKConfig.DefaultLanguage = "fr" ;
//系统是否自动检测并运用适当的语言界面FCKConfig.AutoDetectLanguage = false ;//手动设置默认的语言:法语FCKConfig.DefaultLanguage = "fr" ;
2.2载入自定义配置文件
方法一:全局载入(对工程中所有fckeditor有效)
在fckconfig.js找到
- FCKConfig.CustomConfigurationsPath = '' ;
FCKConfig.CustomConfigurationsPath = '' ;
输入myfckconfig.js位置,FCKConfig.BasePath值fckeditor/editor文件夹
- FCKConfig.CustomConfigurationsPath = FCKConfig.BasePath+'myfckconfig.js ' ;
FCKConfig.CustomConfigurationsPath = FCKConfig.BasePath+'myfckconfig.js ' ;
方法二:局部载入(只对当前网页有效)
- var oFCKeditor = new FCKeditor( "FCKeditor1" ) ;
- oFCKeditor.Config["CustomConfigurationsPath"] = "myconfig.js" ;
- oFCKeditor.Create() ;
var oFCKeditor = new FCKeditor( "FCKeditor1" ) ;oFCKeditor.Config["CustomConfigurationsPath"] = "myconfig.js" ;oFCKeditor.Create() ;
3.在页面的调用代码中对FCKeditor的实例进行配置
- var oFCKeditor = new FCKeditor( "FCKeditor1" ) ;
- oFCKeditor.Config["AutoDetectLanguage"] = "fasle" ;
- oFCKeditor.Create() ;
var oFCKeditor = new FCKeditor( "FCKeditor1" ) ;oFCKeditor.Config["AutoDetectLanguage"] = "fasle" ;oFCKeditor.Create() ;
配置加载顺序
1.加载主配置文件fckconfig.js
2.加载自定义的配置文件(如果有),覆盖相同的配置项
3.使用对实例的配置覆盖相同的配置项(只对当前实例有效)
主配置文件(fckconfig.js部分属性中文注释)
- FCKConfig.CustomConfigurationsPath = '' ; // 自定义配置文件路径和名称
- FCKConfigFCKConfig.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 ;//是否开启调试功能
- FCKConfigFCKConfig.SkinPath = FCKConfig.BasePath 'skins/default/' ; //皮肤路径
- FCKConfig.PreloadImages=... //预装入的图片
- FCKConfig.PluginsPath = FCKConfig.BasePath 'plugins/' ; //插件路径
- FCKConfig.AutoDetectLanguage = true ; //是否自动检测语言
- FCKConfig.DefaultLanguage = 'zh-cn' ; //默认语言
- 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.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.ToolbarLocation = 'In' ;//工具栏位置,
- FCKConfig.ToolbarSets = object ; // 编辑器的工具栏,可以自行定义,删减,可参考已存在工具栏
- FCKConfig.EnterMode = 'p'; // 编辑器中直接回车,在代码中生成,可选为p | div | br
- FCKConfig.ShiftEnterMode = 'br'; // 编辑器中Shift 回车,在代码中生成,可选为p | div | br
- FCKConfig.ContextMenu = 字符串数组; // 右键菜单的内容
- FCKConfig.FontColors = ""; // 文字颜色列表
- FCKConfig.FontNames = ""; // 字体列表
- FCKConfig.FontSizes = ""; // 字号列表
- FCKConfig.FontFormats = ""; // 文字格式列表
- FCKConfig.StylesXmlPath = ""; // CSS样式列表的XML文件的位置
- FCKConfig.TemplatesXmlPath = ""; // 模版的XML文件位置
- FCKConfig.SpellChecker = "ieSpell/Spellerpages"; // 拼写检查器
- FCKConfig.IeSpellDownloadUrl = ""; // 下载拼写检查器的网址
- FCKConfig.FullPage = true/false; // 是否允许编辑整个HTML文件,还是仅允许编辑BODY间的内容
- var _FileBrowserLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | py
- var _QuickUploadLanguage = 'php' ;// asp | aspx | cfm | lasso | php[/code] //第一个是文件浏览器使用的语言,第二个快速上传使用的语言,改成你需要的
- FCKConfig.LinkUploadAllowedExtensions = "" ; // empty for all
- FCKConfig.LinkUploadDeniedExtensions =".(php|php3|php5|phtml|asp|aspx|ascx|jsp|cfm|cfc|pl|bat|exe|dll|reg|cgi)$" //这是两个允许和拒绝上传的文件类型列表
- FCKConfig.ImageBrowser = false ;//是否在插入图片功能里面启用服务器文件浏览功能
- FCKConfigFCKConfig.ImageBrowserURL = FCKConfig.BasePath 'filemanager/browser/default/browser.html?Type=ImageConnector=connectors/' _FileBrowserLanguage '/connector.' _FileBrowserExtension ;
- //Type=Image 表示文件类型是image这会使文件浏览器定位到文件上传路径/image/文件夹下面
- FCKConfig.FlashBrowser = false ;//是否在插入flash功能中启用服务器文件浏览功能
- FCKConfig.LinkUpload = false ;//是否启用插入链接的快速上传功能
- FCKConfig.ImageUpload = false ;//是否启用图片快速上传功能
- FCKConfig.FlashUpload = false ;//是否启用flash上传功能
- FCKConfigFCKConfig.SmileyPath = FCKConfig.BasePath 'images/smiley/msn/'; // 表情文件存放路径
- FCKConfig.SmileyImages = ''; // 表情文件名称列表,具体参考默认设置
- FCKConfig.SmileyColumns = 8; // 表情窗口显示表情列数
- FCKConfig.SmileyWindowWidth = 320; // 表情窗口显示宽度,此窗口会因为表情文件的改变而作调整
- FCKConfig.SmileyWindowHeight = 240; // 表情窗口显示高度,此窗口会因为表情文件的改变而作调整
FCKConfig.CustomConfigurationsPath = '' ; // 自定义配置文件路径和名称 FCKConfigFCKConfig.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 ;//是否开启调试功能 FCKConfigFCKConfig.SkinPath = FCKConfig.BasePath 'skins/default/' ; //皮肤路径 FCKConfig.PreloadImages=... //预装入的图片 FCKConfig.PluginsPath = FCKConfig.BasePath 'plugins/' ; //插件路径 FCKConfig.AutoDetectLanguage = true ; //是否自动检测语言 FCKConfig.DefaultLanguage = 'zh-cn' ; //默认语言 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.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.ToolbarLocation = 'In' ;//工具栏位置, FCKConfig.ToolbarSets = object ; // 编辑器的工具栏,可以自行定义,删减,可参考已存在工具栏 FCKConfig.EnterMode = 'p'; // 编辑器中直接回车,在代码中生成,可选为p | div | br FCKConfig.ShiftEnterMode = 'br'; // 编辑器中Shift 回车,在代码中生成,可选为p | div | br FCKConfig.ContextMenu = 字符串数组; // 右键菜单的内容 FCKConfig.FontColors = ""; // 文字颜色列表 FCKConfig.FontNames = ""; // 字体列表 FCKConfig.FontSizes = ""; // 字号列表 FCKConfig.FontFormats = ""; // 文字格式列表 FCKConfig.StylesXmlPath = ""; // CSS样式列表的XML文件的位置 FCKConfig.TemplatesXmlPath = ""; // 模版的XML文件位置 FCKConfig.SpellChecker = "ieSpell/Spellerpages"; // 拼写检查器 FCKConfig.IeSpellDownloadUrl = ""; // 下载拼写检查器的网址 FCKConfig.FullPage = true/false; // 是否允许编辑整个HTML文件,还是仅允许编辑BODY间的内容 var _FileBrowserLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | py var _QuickUploadLanguage = 'php' ;// asp | aspx | cfm | lasso | php[/code] //第一个是文件浏览器使用的语言,第二个快速上传使用的语言,改成你需要的 FCKConfig.LinkUploadAllowedExtensions = "" ; // empty for all FCKConfig.LinkUploadDeniedExtensions =".(php|php3|php5|phtml|asp|aspx|ascx|jsp|cfm|cfc|pl|bat|exe|dll|reg|cgi)$" //这是两个允许和拒绝上传的文件类型列表 FCKConfig.ImageBrowser = false ;//是否在插入图片功能里面启用服务器文件浏览功能 FCKConfigFCKConfig.ImageBrowserURL = FCKConfig.BasePath 'filemanager/browser/default/browser.html?Type=ImageConnector=connectors/' _FileBrowserLanguage '/connector.' _FileBrowserExtension ; //Type=Image 表示文件类型是image这会使文件浏览器定位到文件上传路径/image/文件夹下面 FCKConfig.FlashBrowser = false ;//是否在插入flash功能中启用服务器文件浏览功能 FCKConfig.LinkUpload = false ;//是否启用插入链接的快速上传功能 FCKConfig.ImageUpload = false ;//是否启用图片快速上传功能 FCKConfig.FlashUpload = false ;//是否启用flash上传功能FCKConfigFCKConfig.SmileyPath = FCKConfig.BasePath 'images/smiley/msn/'; // 表情文件存放路径 FCKConfig.SmileyImages = ''; // 表情文件名称列表,具体参考默认设置 FCKConfig.SmileyColumns = 8; // 表情窗口显示表情列数 FCKConfig.SmileyWindowWidth = 320; // 表情窗口显示宽度,此窗口会因为表情文件的改变而作调整 FCKConfig.SmileyWindowHeight = 240; // 表情窗口显示高度,此窗口会因为表情文件的改变而作调整
常用自定义配置样例
修改语言
- FCKConfig.AutoDetectLanguage = false ;
- FCKConfig.DefaultLanguage = 'zh-cn' ;
FCKConfig.AutoDetectLanguage = false ;FCKConfig.DefaultLanguage = 'zh-cn' ;
添加中文字体
- FCKConfig.FontNames = '宋体;黑体;隶书;楷体_GB2312;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' ;
更换换行模式
- FCKConfig.EnterMode = 'br' ; // p | div | br
- FCKConfig.ShiftEnterMode = 'p' ; // p | div | br
FCKConfig.EnterMode = 'br' ; // p | div | brFCKConfig.ShiftEnterMode = 'p' ; // p | div | br
自定义表情
- FCKConfig.SmileyPath = FCKConfig.BasePath + 'images/ftl/' ;
- FCKConfig.SmileyImages =['01.gif','02.gif','03.gif','04.gif','05.gif','06.gif','07.gif','08.gif','09.gif','10.gif','11.gif','12.gif','13.gif','14.gif','15.gif','16.gif','17.gif','18.gif','19.gif','20.gif','21.gif'] ;
- FCKConfig.SmileyColumns = 8 ;
- FCKConfig.SmileyWindowWidth = 480 ;
- FCKConfig.SmileyWindowHeight = 180 ;
FCKConfig.SmileyPath = FCKConfig.BasePath + 'images/ftl/' ;FCKConfig.SmileyImages =['01.gif','02.gif','03.gif','04.gif','05.gif','06.gif','07.gif','08.gif','09.gif','10.gif','11.gif','12.gif','13.gif','14.gif','15.gif','16.gif','17.gif','18.gif','19.gif','20.gif','21.gif'] ;FCKConfig.SmileyColumns = 8 ;FCKConfig.SmileyWindowWidth = 480 ;FCKConfig.SmileyWindowHeight = 180 ;
如果表情图片太多,可以设置滚动条
1.在fckeditor/editor/dialog/fck_smiley.html 中找到
- window.onload = function ()
- {
- oEditor.FCKLanguageManager.TranslatePage(document) ;
- dialog.SetAutoSize( true ) ;
- }
window.onload = function (){oEditor.FCKLanguageManager.TranslatePage(document) ;dialog.SetAutoSize( true ) ;}
将dialog.SetAutoSize( true ) 改为dialog.SetAutoSize( false)
2.再找到
- <body style="overflow: hidden">
- <body>
<body style="overflow: hidden"><body>
将 hidden改为auto
更换皮肤
- FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/office2003/' ;
FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/office2003/' ;
fckeditor默认提供三种皮肤,如果想得到更多皮肤请访问
http://sourceforge.net/tracker/?atid=740153&group_id=75348&func=browse
自定义工具集
fckeditor提供两种工具集Default/Basic,也可以自己定义
- FCKConfig.ToolbarSets["MYTOOLBAR"] = [
- ['Source','-','FitWindow','-','Preview'],
- ['Undo','Redo'],
- ['Link','Unlink','Anchor'],
- ['Image','Flash','Table','Rule','Smiley','SpecialChar'],
- ['JustifyLeft','JustifyCenter','JustifyRight'],
- ['About'],
- '/',
- ['Bold','Italic','Underline'],
- ['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote'],
- ['FontName','FontSize'],
- ['TextColor','BGColor']
- ] ;
FCKConfig.ToolbarSets["MYTOOLBAR"] = [['Source','-','FitWindow','-','Preview'],['Undo','Redo'],['Link','Unlink','Anchor'],['Image','Flash','Table','Rule','Smiley','SpecialChar'],['JustifyLeft','JustifyCenter','JustifyRight'],['About'],'/',['Bold','Italic','Underline'],['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote'],['FontName','FontSize'],['TextColor','BGColor']] ;
在页面调用,要显示设置FCKeditor对象的ToolbarSet属性
- var oFCKeditor = new FCKeditor( 'MyTextarea' ) ;
- oFCKeditor.BasePath = "fckeditor/" ;
- oFCKeditor.Config["CustomConfigurationsPath"] ='myfckconfig.js ' ;
- oFCKeditor.ToolbarSet="MYTOOLBAR";
- oFCKeditor.Create();
var oFCKeditor = new FCKeditor( 'MyTextarea' ) ;oFCKeditor.BasePath = "fckeditor/" ;oFCKeditor.Config["CustomConfigurationsPath"] ='myfckconfig.js ' ;oFCKeditor.ToolbarSet="MYTOOLBAR";oFCKeditor.Create();