FCK工具条大全

由于FCKeditor功能强大，所以我们可以通过一些简单的设置使FCKeditor更加符合您的项目需求。
设置工具栏很简单，只需打开fckeditor目录下面的fckconfig.js文件，按CTRL+F搜索FCKConfig.ToolbarSets["Default"]代码，找到如下代码。
       FCKConfig.ToolbarSets["Default"] = [
       ['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],
       ['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
       ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
       ['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],
       '/',
       ['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
       ['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','CreateDiv'],
       ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
       ['Link','Unlink','Anchor'],
       ['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
       '/',
       ['Style','FontFormat','FontName','FontSize'],
       ['TextColor','BGColor'],
       ['FitWindow','ShowBlocks','-','About']
]
在默认情况下，FCKeditor会调用上面定义的所有工具栏按钮。可以根据自己的需求进行设置。对上面的配置选项功能说明进行汇总。
代码名称                     功能                                代码名称                                 功能
Source                        源代码                           DocProps                                页面属性
-                                   ｜分隔符                         Save                                         保存
NewPage                   新建                                Preview                                    预览
Templates                 模板                               Cut                                             剪切
Copy                           复制                                Paste                                        粘贴
PasteText                  粘贴为无格式文本        PasteWord                              从MS Word粘贴
Print                            打印                                 SpellCheck                              拼写检查
Undo                          撤消                                Redo                                         重做
Find                            查找                                Replace                                    替换
SelectAll                    全选                                 RemoveFormat                       清除格式
Form                          表单                                 Checkbox                                 复选框
Radio                        单选框                             TextField                                   单行文本
Textarea                    多行文本                          Select                                       列表菜单
Button                        按钮                                 ImageButton                            图像域
HiddenField             隐藏域                               Bold                                            加粗
Italic                           倾斜                                  Underline                                下划线
StrikeThrough          删除线                               Subscript                                 下标
Superscript              上标                                   orderedList                             插入／删除编号列表
UnorderedList         插入／删除项目列表       Outdent                                     减少缩进
Indent                        增加缩进                           Blockquote                              块引用
CreateDiv                 创建DIV                             JustifyLeft                                左对齐
JustifyCenter           居中对齐                           JustifyRight                                右对齐
JustifyFull                 两端对齐                            Link                                            插入／编辑链接
Unlink                       取消链接                            Anchor                                        插入／编辑锚点链接
Image                       插入编辑图像                     Flash                                          插入／编辑Flash
Table                        插入／编辑表格                 Rule                                             插入水平线
Smiley                      插入表情                              SpecialChar                            插入特殊符号
PageBreak              插入分页                             Style                                          样式
FontFormat             格式                                     FontName                               字体
FontSize                  大小                                     TextColor                                 文本颜色
BGColor                  背景颜色                              FitWindow                              全屏编辑
ShowBlocks           显示区域                               About                       关于Fuckeditor               
工具栏配置选项功能进行汇总

你也可以创建一个非默认的工具栏按钮设置，您可以从FCKConfig.ToolbarSets["Default"]当中的代码重新复制一份，然后将Default改成您想要的名字。

注意：fckconfig.js配置选项采用JavaScript语法，如果您不懂JavaScript的话，请在配置之前进行备份。

如果你的编辑器还用在网站前台的话，比如说用于留言本或是日记回复时，那就不得不考虑安全了，在前台千万不要使用Default的toolbar，要么自定义一下功能，要么就用系统已经定义好的Basic，也就是基本的toolbar,这里配置了一个适合于大部份网站使用的工栏目按钮
FCKConfig.ToolbarSets["MyDesign"] = [
['Source','DocProps','-','NewPage','Preview','-','Templates'],
['Cut','Copy','Paste','PasteText','PasteWord','-','Print','SpellCheck'],
['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','CreateDiv'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
['Link','Unlink','Anchor'],
['Style','FontFormat','FontName','FontSize'],
['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
['TextColor','BGColor'],
['FitWindow','ShowBlocks']] ;
要想使用自定义的工具栏按钮，必须在创建FCKeditor实例后设置使用的工具栏选项。
oFCKeditor.ToolbarSet = "MyDesign";       //JavaScript

接下来，我们对常用的一些设置选项功能进行总结，可参考fckeditor目录下fckconfig.js文件进行阅读

FCKConfig.AutoDetectLanguage             自动语言检查
FCKConfig.DefaultLanguage                    默认语言设计，建议改成zh-cn
FCKConfig.ContextMenu                            右键菜单内容
FCKConfig.ToolbarStartExpanded           当页面载入的时候，工具栏默认情况下是否展开
FCKConfig.FontColors                               文字颜色列表
FCKConfig.FontNames                             字体列表，可加入国内常用的字体，如宋体、揩体、黑体等
FCKConfig.FontSizes                                 字号列表
FCKConfig.FontFormats                            文字格式列表
FCKConfig.StylesXmlPath                         指定风格XML文件路径
FCKConfig.TemplatesXmlPath                 指定模板XML文件路径
FCKConfig.BodyId                                       设置编辑器的id
FCKConfig.BodyClass                               设置编辑器的class
FCKConfig.DefaultLinkTarget                   设置链接默认情况下的target属性
FCKConfig.BaseHref                                  相对链接的基地址
FCKConfig.SkinPath                                  设置默认皮肤路径
FCKConfig.SmileyPath                              表情文件路径，您可以设置此项更改表情
FCKConfig.SmileyImage                          表情文件
FCKConfig.SmileyColumns                     将表情分成几列显示
FCKConfig.SmileyWindowWidth             显示表情窗口的宽度，单位像素
FCKConfig.SmileyWindowHeight           显示表情窗口的高度，单位像素
FCKConfig.TabSpaces                             编辑器域内是否可以使用Tab键,1为可以,默认为0(不可以)

    接下来是编辑器位置的设置，我的习惯是把editor放在根目录下，最开始所述的六个文件也放在根目录下（Tips:建议放在根目录下，并且建议使用时设置路径也采用绝对路径，如"/fckeditor/"，而我的习惯的设置是"/"），这样有利于fckeditor的更新升级，并且网站下所有文件夹都可以任意调用，不存在其它文件夹名变了而其它地方就无法使用编辑器的问题。
    打开fckeditor.js文件，找到 this.BasePath = '/fckeditor/' ;改为 this.BasePath = '/' ;
    编辑器域内默认的显示字体为12px，想要修改可以通过修改样式表来达到要求，打开editor/css/fck_editorarea.css，把第4行改为 font-size: 14px;即可。 14即为你想要的字体的大小

FCKEDITOR类参考:(fckeditor.js)
下面是用来在页面中建立编辑器的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的样式工具栏中提供了预定义的样式,样式是通过XML文件定义的,默认的XML样式文件存在于FCkEditor根文件夹下的FckStyls.xml文件中
这个XML文件的结构分析如下:
<?xml version="1.0" encoding="utf-8" ?>
<Styles >
<Style name="My Image" element="img">
<Attribute name="style" value="padding: 5px" />
<Attribute name="border" value="2" />
</Style >
<Style name="Italic" element="em" />
<Style name="Title" element="span">
<Attribute name="class" value="Title" />
</Style >
<Style name="Title H3" element="h3" />
</Styles>

每一个STYLE标记定义一种样式，NAME是显示在下拉列表中的样式名，ELEMENT属性指定此样式所适用的对象，因为FCKEDITOR中的样式是上下文敏感的，也就是说,选择不同的对象，仅会显示针对这类对象定义的样式。