现在的位置: 首页 > 综合 > 正文

FCKeditor 2.3 设置.修改.使用(1)

2013年02月11日 ⁄ 综合 ⁄ 共 2973字 ⁄ 字号 评论关闭

FCKeditor 在编辑器这一块绝对称得上强大,且开源,不断更新,多种语言支持,故使用者众多,如百度和csdn就是他的使用者。

现就最新版(2.3)的设置和使用做简单的介绍,期望能对你有所帮助,本着时间最宝贵原则,废话少叙。

【1】精简

进入FCKeditor_2.3.2/FCKeditor下,先把以“_”为开头的文件夹删除,这些文件夹里放的是范例或是一些其它工具。其实也就是只保留editor文件夹、fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml就可以了,最外层的精简化完毕,进入到editor文件夹内,先把“_source”文件夹删除,这里是一些源文件,对于使用来说没什么用处。 

进入editorimages/smiley文件夹,些文件是放表情图标的,由于接下来我会用我自己的表情图标,先把他们的删除,当然,如果你想用这里的表情图标那就不要删掉了。

退出 images再进入lang文件夹内,只保留zh-cn.js、en.js、zh.js这四个文件,有了它才能和fckconfig.js里的设置成对对应上相应的语言文件,zh-cn.js是简体中文语言包,en.js就不用说了吧,zh.js是繁体中文的。一下子少了几百K。

再退出lang文件夹,进入skin文件夹,如果你想使用fckeditor默认的这种奶黄色,那就把除了default文件夹外的另两个文件夹直接删除,silver,office2003 。

精简的最后一步,退出skin文件夹,再进入filemanager,如果你用的不是最新版的fckeditor的话,那这里就一个文件夹browser,新版的还有一个upload文件夹。先进入到filemanager/browser/default/connectors/下。然后再进入filemanager/upload/下,精简化结束,接下来,我们对编辑器进行设置修改。 

【2】修改

第一个修改的文件,也就是fckeditor总配置文件,位于根目录下的fckconfig.js文件。请根据下面的列表进行

找到 FCKConfig.DefaultLanguage = ’en’ ;改为 FCKConfig.DefaultLanguage = ’zh-cn’ ;设置默认语言为简体中文 
找到 FCKConfig.TabSpaces = 0 ; 改为FCKConfig.TabSpaces = 1 ; 即在编辑器域内可以使用Tab键。 

如果你的编辑器还用在网站前台的话,比如blog,考虑安全,在前台千万不要使用Default的toolbar,要么自定义一下功能,要么就用系统已经定义好的Basic,也就是基本的toolbar, 
找到第64行: 

FCKConfig.ToolbarSets["Basic"] = [ 
[’Bold’,’Italic’,’-’,’OrderedList’,’UnorderedList’,’-’,/*’Link’,*/’Unlink’,’-’,’Style’,’FontSize’,’TextColor’,’BGColor’,’-’,’Smiley’,’SpecialChar’,’Replace’,’Preview’] 
] ; 

这是我改过的Basic,把图像功能去掉,把添加链接功能去掉,因为图像和链接和flash和图像按钮添加功能都能让前台页直接访问和上传文件,要是这儿不改直接给你上传个木马还不玩完?

找到:  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’ ;  
 

而如果你还想用自己的表情图标的话,改掉那个表情图标的文件夹地址,以及下面的表情图标的文件名,再下面那三个数字是每行显示表情数及弹出窗口的宽和高了,这个的大小要根据您的表情图标排列的窗口的大小而定了。OK,总配置文件修改结束。 

FCKConfig.SmileyPath = FCKConfig.BasePath + 'images/smiley/msn/' ;
FCKConfig.SmileyImages = ['regular_smile.gif','sad_smile.gif','wink_smile.gif','teeth_smile.gif','confused_smile.gif','tounge_smile.gif','embaressed_smile.gif','omg_smile.gif','whatchutalkingabout_smile.gif','angry_smile.gif','angel_smile.gif','shades_smile.gif','devil_smile.gif','cry_smile.gif','lightbulb.gif','thumbs_down.gif','thumbs_up.gif','heart.gif','broken_heart.gif','kiss.gif','envelope.gif'] ;
FCKConfig.SmileyColumns = 8 ;
FCKConfig.SmileyWindowWidth  = 320 ;
FCKConfig.SmileyWindowHeight = 240 ;

接下来是编辑器位置的设置,自己定吧。需要改下面的:

【3】使用

在你的使用文件里添加类似:

<script type="text/javascript">
<!--
var sBasePath = document.location.pathname.substring(0,document.location.pathname.lastIndexOf('_testcases')) ;

var oFCKeditor = new FCKeditor( 'model.content' ) ;
oFCKeditor.BasePath = sBasePath ;
oFCKeditor.Width = 700 ;
oFCKeditor.Height = 500 ;
oFCKeditor.Value = '' ;
oFCKeditor.Create() ;
//-->
  </script>

找到 sBasePath = "/fckeditor/"改为 sBasePath = "/" 
打开fckeditor.js文件,找到 this.BasePath = ’/fckeditor/’ ;改为 this.BasePath = ’/’ ; 

修改编辑器域内默认的显示字体,打开/editor/css/fck_editorarea.css。

 

【获得'model.content'的值】

JS用alert( FCKeditorAPI.GetInstance('model.content').GetXHTML( true ))得到'model.content'的值;


抱歉!评论已关闭.