FckEditor配置手冊(cè)中文教程詳細(xì)說(shuō)明_第1頁(yè)
FckEditor配置手冊(cè)中文教程詳細(xì)說(shuō)明_第2頁(yè)
FckEditor配置手冊(cè)中文教程詳細(xì)說(shuō)明_第3頁(yè)
FckEditor配置手冊(cè)中文教程詳細(xì)說(shuō)明_第4頁(yè)
FckEditor配置手冊(cè)中文教程詳細(xì)說(shuō)明_第5頁(yè)
已閱讀5頁(yè),還剩27頁(yè)未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

1、FckEditor配置手冊(cè)中文教程詳細(xì)說(shuō)明性能 首先,FCKEDITOR的性能是非常好的,用戶只需很少的時(shí)間就可以載入FCKEDITOR所需文件.對(duì)于其他在線編輯器來(lái)說(shuō),這幾乎是個(gè)很難解決的難題,因?yàn)樵陂_啟編輯器時(shí)需要裝載太多的文件.比如CUTEEDITOR,雖然功能比FCKEDITOR還要強(qiáng)大,可是,它本身也夠龐大了,至于FREETEXTBOX等,其易用性與FCKEDITOR相比,尚有差距,可以說(shuō),FCKEDITOR是一個(gè)別具匠心的在線編輯器,它里面融入了作者高深的面向?qū)ο蟮腏AVASCRIPT功力,集易用性與強(qiáng)大的功能與一體. .與編輯器相關(guān)的所有圖像,腳本以及調(diào)用頁(yè) .語(yǔ)言文件 .編輯器

2、的皮膚文件 .工具樣的貼圖等 這些將導(dǎo)致在服務(wù)器和客戶端間產(chǎn)生相當(dāng)?shù)牧髁?如果有許多文件被調(diào)用,那么即便每個(gè)文件很小.也會(huì)讓用戶等得不耐煩. 裝載順序 從2.0版開始,編輯器按以下步驟裝載資源: .基本頁(yè)(就是編輯器所在頁(yè))以及裝入編輯器的JS腳本 .用來(lái)建立編輯器的腳本 .編輯器的語(yǔ)言和皮膚. .建立編輯器. .載入預(yù)置的編輯文檔內(nèi)容. .從現(xiàn)在開始,用戶可以閱讀和編輯文檔了,不過(guò),拖拽支持以及工具欄都是不可用的 .載入編輯器引擎腳本 .建立工具欄,并且可用 .從現(xiàn)在開始,編輯器的所有功能都已經(jīng)完整 .載入工具欄圖標(biāo) 腳本壓縮 在打包任何新版本時(shí),編輯器的JS腳本將會(huì)進(jìn)行預(yù)處理.預(yù)處理步驟如

3、下: .移除所有代碼注釋 .移除所有無(wú)用的空白字符. .將腳本合并成幾個(gè)文件 使用上面的方法,我們可以將腳本文件的大小壓縮到原來(lái)的50%. 壓縮后,原始的代碼仍然存在于一個(gè)名為_Source的文件夾中 如何打包? 編輯器已經(jīng)自帶了打包程序,它位于FCKEDITOR的根文件夾中_PACKAGER文件夾中,名為Fckeditor.Packager.exe,將其復(fù)制到FCKEDITOR根文件夾中并運(yùn)行,即可自動(dòng)將JS腳本打包并壓縮 需要注意的是該程序是一個(gè).NET程序,必須安裝.NET FRAMEWORK才能使用 想要獲取支持? 如果你捐贈(zèng)15000歐元,你就可以獲得1年的免費(fèi)技術(shù)支持(比較貴的說(shuō),

4、相當(dāng)于人民幣15萬(wàn),不過(guò)西歐的費(fèi)用相當(dāng)驚人) 如何安裝? 1.下載最新版的FCKEDITOR 2.解壓縮到你的站點(diǎn)根文件夾中名為FCKEDITOR的文件夾中(名稱必須為FCKEDITOR,因?yàn)榕渲梦募幸呀?jīng)使用此名稱來(lái)標(biāo)示出FCKEDITOR的位置) 3.現(xiàn)在,編輯器就可以使用了,如果想要查看演示,可以按下面方法訪問(wèn): http:/FCKeditor/_samples/default.html 注意:你可以將FCKEDITOR放置到任何文件夾,默認(rèn)情況下,將其放入到FCKEDITOR文件夾是最為簡(jiǎn)單的方法.如果你放入的文件夾使用別的名稱,請(qǐng)修改配置文件夾中編輯器BasePath參數(shù),如下所示:

5、 oFckeditor.BasePath=/Components/fckeditor/; 另外,FCKEDITOR文件夾中所有以下劃線開頭的文件夾及文件,都是可選的,可以安全的從你的發(fā)布中刪除.它們并不是編輯器運(yùn)行時(shí)必需的 如何將FCKEDITOR整合進(jìn)我的頁(yè)面? 由于目前的版本提供的FCKEDITOR僅提供了JAVASCRIPT式的整合,因此,這里僅講述如何應(yīng)用JAVASCRIPT來(lái)整合FCKEDITOR到站點(diǎn)中,當(dāng)然,其他各種語(yǔ)言的整合,你可以參考_samples文件夾中的例子來(lái)完成 1,假如編輯器已經(jīng)安裝在你的站點(diǎn)的/FCKEDITOR/文件夾下.那么,第一步我們需要做的就是在頁(yè)面的HE

6、AD段中放入SCRIPT標(biāo)記以引入JAVASCRIPT整合模塊.例如: 其中路徑是可更改的 2,現(xiàn)在,FCKEDITOR類已經(jīng)可以使用了.有兩個(gè)方法在頁(yè)面中建立一個(gè)FCKEDITOR編輯器: 方法1:內(nèi)聯(lián)方式(建議使用):在頁(yè)面的FORM標(biāo)記內(nèi)需要插入編輯器的地方置入以下代碼: script type=text/javascript var oFCKeditor = new FCKeditor( FCKeditor1 ) ; oFCKeditor.Create() ; 方法2:TEXTAREA標(biāo)記替換法(不建議使用):在頁(yè)面的ONLOAD事件中,添加以下代碼以替換一個(gè)已經(jīng)存在的TEXTAREA

7、標(biāo)記 window.onload = function() var oFCKeditor = new FCKeditor( MyTextarea ) ; oFCKeditor.ReplaceTextarea() ; This is the initial value. 3.現(xiàn)在,編輯器可以使用了 FCKEDITOR類參考: 下面是用來(lái)在頁(yè)面中建立編輯器的FCKEDITOR類的說(shuō)明 構(gòu)造器: FCKeditor( instanceName, width, height, toolbarSet, value ) instanceName:編輯器的唯一名稱(相當(dāng)于ID) WIDTH:寬度 HEIGH

8、T:高度 toolbarSet:工具條集合的名稱 value:編輯器初始化內(nèi)容 屬性: instanceName:編輯器實(shí)例名 width:寬度,默認(rèn)值為100% height:高度,默認(rèn)值是200 ToolbarSet:工具集名稱,參考FCKCONFIG.JS,默認(rèn)值是Default value:初始化編輯器的HTML代碼,默認(rèn)值為空 BasePath:編輯器的基路徑,默認(rèn)為/Fckeditor/文件夾,注意,盡量不要使用相對(duì)路徑.最好能用相對(duì)于站點(diǎn)根路徑的表示方法,要以/結(jié)尾 CheckBrowser:是否在顯示編輯器前檢查瀏覽器兼容性,默認(rèn)為true DisplayErrors:是否顯示

9、提示錯(cuò)誤,默為true; 集合: ConfigKey=value; 這個(gè)集合用于更改配置中某一項(xiàng)的值,如 oFckeditor.ConfigDefaultLanguage=pt-br; 方法: Create() 建立并輸出編輯器 RepaceTextArea(TextAreaName) 用編輯器來(lái)替換對(duì)應(yīng)的文本框 如何配置FCKEDITOR? FCKEDITOR提供了一套用于定制其外觀,特性及行為的設(shè)置集.主配置文件名為Fckconfig.js 你既可以編輯主配置文件,也可以自己定義單獨(dú)的配置文件.配置文件使用JAVASCRIPT語(yǔ)法. 修改后,在建立編輯器時(shí),可以使用以下語(yǔ)法: var oF

10、CKeditor = new FCKeditor( FCKeditor1 ) ; oFCKeditor.ConfigCustomConfigurationsPath = /myconfig.js ; oFCKeditor.Create() ; 提醒:當(dāng)你修改配置后,請(qǐng)清空瀏覽器緩存以查看效果 配置選項(xiàng): AutoDetectLanguage=true/false 自動(dòng)檢測(cè)語(yǔ)言 BaseHref= _fcksavedurl= 相對(duì)鏈接的基地址 ContentLangDirection=ltr/rtl 默認(rèn)文字方向 ContextMenu=字符串?dāng)?shù)組,右鍵菜單的內(nèi)容 CustomConfigura

11、tionsPath= 自定義配置文件路徑和名稱 Debug=true/false 是否開啟調(diào)試功能,這樣,當(dāng)調(diào)用FCKDebug.Output()時(shí),會(huì)在調(diào)試窗中輸出內(nèi)容 DefaultLanguage= 缺省語(yǔ)言 EditorAreaCss= 編輯區(qū)的樣式表文件 EnableSourceXHTML=true/false 為TRUE時(shí),當(dāng)由可視化界面切換到代碼頁(yè)時(shí),把HTML處理成XHTML EnableXHTML=true/false 是否允許使用XHTML取代HTML FillEmptyBlocks=true/false 使用這個(gè)功能,可以將空的塊級(jí)元素用空格來(lái)替代 FontColors=

12、 設(shè)置顯示顏色拾取器時(shí)文字顏色列表 FontFormats= 設(shè)置顯示在文字格式列表中的命名 FontNames= 字體列表中的字體名 FontSizes= 字體大小中的字號(hào)列表 ForcePasteAsPlainText=true/false 強(qiáng)制粘貼為純文本 ForceSimpleAmpersand=true/false 是否不把&符號(hào)轉(zhuǎn)換為XML實(shí)體 FormatIndentator= 當(dāng)在源碼格式下縮進(jìn)代碼使用的字符 FormatOutput=true/false 當(dāng)輸出內(nèi)容時(shí)是否自動(dòng)格式化代碼 FormatSource=true/false 在切換到代碼視圖時(shí)是否自動(dòng)格式化代碼 Fu

13、llPage=true/false 是否允許編輯整個(gè)HTML文件,還是僅允許編輯BODY間的內(nèi)容 GeckoUseSPAN=true/false 是否允許SPAN標(biāo)記代替B,I,U標(biāo)記 IeSpellDownloadUrl=下載拼寫檢查器的網(wǎng)址 ImageBrowser=true/false 是否允許瀏覽服務(wù)器功能 ImageBrowserURL= 瀏覽服務(wù)器時(shí)運(yùn)行的URL ImageBrowserWindowHeight= 圖像瀏覽器窗口高度 ImageBrowserWindowWidth= 圖像瀏覽器窗口寬度 LinkBrowser=true/false 是否允許在插入鏈接時(shí)瀏覽服務(wù)器 L

14、inkBrowserURL= 插入鏈接時(shí)瀏覽服務(wù)器的URL LinkBrowserWindowHeight=鏈接目標(biāo)瀏覽器窗口高度 LinkBrowserWindowWidth=鏈接目標(biāo)瀏覽器窗口寬度 Plugins=object 注冊(cè)插件 PluginsPath= 插件文件夾 ShowBorders=true/false 合并邊框 SkinPath= 皮膚文件夾位置 SmileyColumns=12 圖符窗列數(shù) SmileyImages=字符數(shù)組 圖符窗中圖片文件名數(shù)組 SmileyPath= 圖符文件夾路徑 SmileyWindowHeight 圖符窗口高度 SmileyWindowWid

15、th 圖符窗口寬度 SpellChecker=ieSpell/Spellerpages 設(shè)置拼寫檢查器 StartupFocus=true/false 開啟時(shí)FOCUS到編輯器 StylesXmlPath= 設(shè)置定義CSS樣式列表的XML文件的位置 TabSpaces=4 TAB鍵產(chǎn)生的空格字符數(shù) ToolBarCanCollapse=true/false 是否允許展開/折疊工具欄 ToolbarSets=object 允許使用TOOLBAR集合 ToolbarStartExpanded=true/false 開啟是TOOLBAR是否展開 UseBROnCarriageReturn=true/

16、false 當(dāng)回車時(shí)是產(chǎn)生BR標(biāo)記還是P或者DIV標(biāo)記 如何自定義樣式列表呢? FCKEDITOR的樣式工具欄中提供了預(yù)定義的樣式,樣式是通過(guò)XML文件定義的,默認(rèn)的XML樣式文件存在于FCkEditor根文件夾下的FckStyls.xml文件中 這個(gè)XML文件的結(jié)構(gòu)分析如下: 每一個(gè)STYLE標(biāo)記定義一種樣式,NAME是顯示在下拉列表中的樣式名,ELEMENT屬性指定此樣式所適用的對(duì)象,因?yàn)镕CKEDITOR中的樣式是上下文敏感的,也就是說(shuō),選擇不同的對(duì)象,僅會(huì)顯示針對(duì)這類對(duì)象定義的樣式 拼寫檢查 FCKEDITOR帶了兩種拼寫檢查工具,一種是ieSpell,默認(rèn)情況下使用這種,使用這種方式

17、的拼寫檢查,要求客戶下載并安裝iespell這個(gè)小軟件,另外,也提供SpellPager的方式來(lái)進(jìn)行拼寫檢查,不過(guò),由于SPELLPAGER是由PHP編寫的服務(wù)器端腳本,因此,要求你的WEB服務(wù)器必須支持PHP腳本語(yǔ)言方可 更改拼寫檢查器的方式請(qǐng)參見(jiàn)有關(guān)配置文件的詳細(xì)說(shuō)明 壓縮腳本 為了提供腳本載入的效率,FCKEDITOR采用以下方法對(duì)腳本盡量壓縮以減少腳本尺寸: 1,移除掉腳本中的注釋 2.移除掉腳本中所有無(wú)意義的空白 另外,FCKEDITOR還提供了一個(gè)專門用于壓縮腳本的工具以便 你在發(fā)布時(shí)能減小文件尺寸, 你可以將_Packager文件夾中的Fckeditor.Packager.exe

18、復(fù)制到FCKEDITOR根文件夾來(lái)運(yùn)行并壓縮腳本 本地化FCKEDITOR 如果FCKEDITOR沒(méi)有提供您所需要的語(yǔ)言(實(shí)際上全有了),你也可以自行制作新的語(yǔ)言 ,你只需要復(fù)制出EN.JS,然后在其基礎(chǔ)上進(jìn)行翻譯.另外,語(yǔ)言名稱與對(duì)應(yīng)的腳本文件名必須遵循RFC 3066標(biāo)準(zhǔn),但是,需要小寫,例如:Portuguess Language對(duì)應(yīng)的腳本文件名必須為pt.js 如果需要針對(duì)某個(gè)國(guó)家的某種語(yǔ)系,則可以在語(yǔ)系縮寫后加上橫線及國(guó)家縮寫即可 在使用時(shí),系統(tǒng)會(huì)自動(dòng)偵測(cè)客戶端語(yǔ)系及國(guó)別而運(yùn)用適當(dāng)?shù)慕缑嬲Z(yǔ)言. 當(dāng)建立一種新的語(yǔ)言后,你必須在Edit/lang/fcklanguagemanager.j

19、s中為其建立一個(gè)條目,如下所示: FCKLanguageManager.AvailableLanguages = en : English, pt : Portuguese 需要提醒的是,文件必須保存為UTF-8格式 如何與服務(wù)器端腳本進(jìn)行交互? 請(qǐng)查看例子以得到相關(guān)內(nèi)容 另外,在ASP.NET中以以下步驟使用 1.把FCKEDITOR添中到工具箱 2.托拽FCKEDITOR控件到頁(yè)面 3.為其指定名稱 4.FCKEDITOR類的所有屬性不光可以在代碼中使用,而且可以作為FCKEDITOR控件的屬性直接使用,例如,要改變皮膚,可以在UI頁(yè)面中指定SkinPath=/fckeditor/edit

20、or/skins/office2003即可,其實(shí)FCKEDITOR的ASP.NET版本可以做得更好,你可以找到FCKEDITOR ASP.NET 2.1的源文件,然后修改該控件的設(shè)計(jì),為其暴露更多有用的屬性,重新編譯即可 5,POSTBACK后的數(shù)據(jù),使用FCKEDITOR控件的value屬性獲得 6.由于默認(rèn)狀態(tài)下,ASP.NET不允許提交含有HTML及JAVASCRIPT的內(nèi)容,因此,你必須將使用FCKEDITOR的頁(yè)面的ValidateRequest設(shè)為false.(即可) 附: 一、如何設(shè)置上傳文件語(yǔ)言 把FCKeditor根目錄下面的fckconfig.js文件里 var _File

21、BrowserLanguage = asp ; / asp | aspx | cfm | lasso | perl | php | py var _QuickUploadLanguage = asp ; / asp | aspx | cfm | lasso | php 這兩行中改成您所需要調(diào)用的編輯器語(yǔ)言,如用則改為aspx; 二、解決中文的問(wèn)題: 在web.config中加入: 這樣設(shè)置后可以顯示中文的文件,但URL地址也是中文的; 如果服務(wù)器對(duì)中文地址的解析不好,可能導(dǎo)致圖片無(wú)法瀏覽; 所以修改:editorfilemanagerbrowserdefaultfrmresour

22、ceslist.html 中的OpenFile函數(shù),把 window.top.opener.SetUrl( fileUrl ) ; 修改為: window.top.opener.SetUrl( escape(fileUrl) ) ; 三.設(shè)置上傳的目錄: 1:在web.config中設(shè)置: 2:在Session中設(shè)置: 在editorfilemanagerbrowserdefaultconnectorsaspxconnector.aspx中加入以下代碼: protected override void OnInit(EventArgs e) SessionFCKeditor:UserFiles

23、Path = /fck/UpLoad1/; 如何在中動(dòng)態(tài)設(shè)置上傳圖片的路徑? 1.在javascript中修改FCKConfig.ImageBrowserURL的值,修改方式如下: FCKConfig.ImageBrowserURL += ?Path=要上傳的文件路徑; 如:要把文件上傳到站點(diǎn)根目錄的UploadFile文件夾中,則設(shè)置為: FCKConfig.ImageBrowserURL += ?Path=/UploadFile; 2.在editorfilemanagerbrowserdefaultconnectorsaspxconnector.aspx文件最后中增加以下程序

24、: protected override void OnInit(EventArgs e) if( Request.QueryStringPath=null ) SessionFCKeditor:UserFilesPath = /UpLoadFiles/; /設(shè)置默認(rèn)值 else SessionFCKeditor:UserFilesPath = Request.QueryStringPath; - 多環(huán)境下的配置和使用技巧 - 在fckeditor中添加右鍵菜單 現(xiàn)在網(wǎng)上介紹FCKEditor如何配置,如何精簡(jiǎn)的例子非常之多,如有需要可以google一下,此處不必贅述?,F(xiàn)在介紹一下,如何自定義

25、此編輯器,暫包括如何添加工具條上的item,產(chǎn)生響應(yīng),添加右鍵菜單。IT SEEMS VERY EASY! 閑言少敘,書歸正傳。 一、自定義右鍵菜單: 1、 首先,在editor/lang/zh-cn.js里添加你所要添加的工具條item的名字,此文件定義了一個(gè)FCKLang變量,仿照里邊的格式寫哦,如:First: 第一,注意,如果是不在倒數(shù)第二行(倒數(shù)第一行是“”),后邊的這個(gè)逗號(hào)是一定要有的,不然網(wǎng)頁(yè)中不會(huì)出現(xiàn)編輯器,筆者曾經(jīng)犯過(guò)如此低級(jí)的錯(cuò)誤,待醒悟后,找一僻靜之所大嘴巴子招呼;呵呵,我們是中國(guó)人,自然在冒號(hào)后對(duì)應(yīng)漢語(yǔ),這也是將來(lái)在網(wǎng)頁(yè)中顯示的內(nèi)容。 2、 之后,在editor/_so

26、urce/internals/fckcommands.js 里新建一個(gè)command:case First: oCommand = new FCKFirstCommand ( First, FCKLang.First); break注意那個(gè)紅色字體的FCKFirstCommand了么?這個(gè)是一個(gè)自定義的command,稍候?qū)⒂懻撍?3、 然后,在editor/_source/internals/fckcontextmenu.js 添加一個(gè)context menu 。 在case Generic : 下面添加如下: oGroup.Add( new FCKContextMenuItem( thi

27、s, First, FCKLang.First, true ) ) ; 其中第四個(gè)布爾類型的參數(shù),如果指定為true,說(shuō)明菜單有圖標(biāo),反之則無(wú)。在此,我指明了我所自定義的菜單是有圖標(biāo)的,那么我就應(yīng)該把圖標(biāo)放在editorskinsxxxtoolbar目錄下,其中xxx就是你在你的配置文件里選擇的編輯器的皮膚,但是我們的圖標(biāo)命名可是有學(xué)問(wèn)的,必須是如FCKContextMenuItem構(gòu)造函數(shù)(且這么叫它)第二個(gè)字符串參數(shù)的小寫字母形式,如,這里我的圖標(biāo)被命名為first.gif了。 Ok,如此右鍵菜單就被添加上去了,運(yùn)行你的網(wǎng)頁(yè),看看FCKEditor是否奏效?如果不奏效的話就要重新參考此文嘍

28、_。 4、然后,還有最關(guān)鍵的一步:用editor下的fckeditor.original.html網(wǎng)頁(yè)的內(nèi)容代替fckeditor.html的內(nèi)容,同時(shí)不要忘記備份fckeditor.html文件! 5、現(xiàn)在開始討論步驟2中的FCKFirstCommand。菜單添加上其了,你總得讓丫擁有什么功能吧?好,在editor/_source/commandclasses/fck_othercommands.js里新建這個(gè)類: 四大 FCKeditor 實(shí)戰(zhàn)應(yīng)用技巧 一般建立好類后,還要建立兩個(gè)靜態(tài)函數(shù):xxx .prototype.Execute,xxx .prototype.GetState。前者是

29、事件處理函數(shù),即點(diǎn)擊了該右鍵菜單所要執(zhí)行的功能全部寫在這個(gè)函數(shù),后者返回菜單的狀態(tài)(可用?不可用?)。在此為了演示,我們實(shí)現(xiàn)一個(gè)最簡(jiǎn)單的功能: FCKPageCtotype.Execute = function() window.alert(It works!);夠簡(jiǎn)單吧,只是不疼不癢的彈出一個(gè)提示框。 當(dāng)然,這里我們也可以不用自定義的FCKFirstCommand,而直接用FCKEditor定義好的command,比如FCKDialogCommand,它也定義在fck_othercommands.js里,當(dāng)然如果這樣的話,彈出的會(huì)是一個(gè)dialog。 再次運(yùn)行網(wǎng)頁(yè),右擊,

30、點(diǎn)擊你的自定義菜單,是否彈出提示框呢? FCKeditor至今已經(jīng)到了2.3.1版本了,對(duì)于國(guó)內(nèi)的WEB開發(fā)者來(lái)說(shuō),也基本上都已經(jīng)“聞風(fēng)知多少”了,很多人將其融放到自己的項(xiàng)目中,更有很多大型的網(wǎng)站從中吃到了甜頭。今天開始,我將一點(diǎn)點(diǎn)的介紹自己在使用FCKeditor過(guò)程中總結(jié)的一些技巧,當(dāng)然這些其實(shí)是FCK本來(lái)就有的,只是很多人用FCK的時(shí)候沒(méi)發(fā)現(xiàn)而已 :P 1、適時(shí)打開編輯器 很多時(shí)候,我們?cè)诖蜷_頁(yè)面的時(shí)候不需要直接打開編輯器,而在用到的時(shí)候才打開,這樣一來(lái)有很好的用戶體驗(yàn),另一方面可以消除FCK在加載時(shí)對(duì)頁(yè)面打開速度的影響,如圖所示 點(diǎn)擊“Open Editor按鈕后才打開編輯器界面 實(shí)現(xiàn)

31、原理:使用JAVASCRIPT版的FCK,在頁(yè)面加載時(shí)(未打開FCK),創(chuàng)建一個(gè)隱藏的TextArea域,這個(gè)TextArea的name和ID要和創(chuàng)建的FCK實(shí)例名稱一致,然后點(diǎn)擊Open Editor按鈕時(shí),通過(guò)調(diào)用一段函數(shù),使用FCK的ReplaceTextarea()方法來(lái)創(chuàng)建FCKeditor,代碼如下 2、使用FCKeditor 的 API FCKeditor編輯器,提供了非常豐富的API,用于給End User實(shí)現(xiàn)很多想要定制的功能,比如最基本的數(shù)據(jù)驗(yàn)證,如何在提交的時(shí)候用JS判斷當(dāng)前編輯器區(qū)域內(nèi)是否有內(nèi)容,F(xiàn)CK的API提供了GetLength()方法; 再比如如何通過(guò)腳本向FC

32、K里插入內(nèi)容,使用InsertHTML()等; 還有,在用戶定制功能時(shí),中間步驟可能要執(zhí)行FCK的一些內(nèi)嵌操作,那就用ExecuteCommand()方法。 詳細(xì)的API列表,請(qǐng)查看FCKeditor的Wiki。而常用的API,請(qǐng)查看FCK壓縮包里的_samples/html/sample08.html。此處就不貼代碼了。 3、外聯(lián)編輯條(多個(gè)編輯域共用一個(gè)編輯條) 這個(gè)功能是2.3版本才開始提供的,以前版本的FCKeditor要在同一個(gè)頁(yè)面里用多個(gè)編輯器的話,得一個(gè)個(gè)創(chuàng)建,現(xiàn)在有了這個(gè)外聯(lián)功能,就不用那么麻煩了,只需要把工具條放在一個(gè)適當(dāng)?shù)奈恢?,后面就可以無(wú)限制的創(chuàng)建編輯域了,如圖: 要實(shí)現(xiàn)

33、這種功能呢,需要先在頁(yè)面中定義一個(gè)工具條的容器:,然后再根據(jù)這個(gè)容器的id屬性進(jìn)行設(shè)置。 ASP實(shí)現(xiàn)代碼: JAVASCRIPT實(shí)現(xiàn)代碼: FCKeditor 1: !- / Automatically calculates the editor base path based on the _samples directory. / This is usefull only for these samples. A real application should use something like this: / oFCKeditor.BasePath = /fckeditor/ ; /

34、/fckeditor/ is the default value. var sBasePath = document.location.pathname.substring(0,document.location.pathname.lastIndexOf(_samples) ; var oFCKeditor = new FCKeditor( FCKeditor_1 ) ; oFCKeditor.BasePath = sBasePath ; oFCKeditor.Height = 100 ; oFCKeditor.Config ToolbarLocation = Out:parent(xTool

35、bar) ; oFCKeditor.Value = This is some sample text. You are using FCKeditor. ; oFCKeditor.Create() ; /- FCKeditor 2: !- oFCKeditor = new FCKeditor( FCKeditor_2 ) ; oFCKeditor.BasePath = sBasePath ; oFCKeditor.Height = 100 ; oFCKeditor.Config ToolbarLocation = Out:parent(xToolbar) ; oFCKeditor.Value

36、= This is some sample text. You are using FCKeditor. ; oFCKeditor.Create() ; /- 此部分的詳細(xì)DEMO請(qǐng)參照: _samples/html/sample11.html _samples/html/sample11_frame.html 4、文件管理功能、文件上傳的權(quán)限問(wèn)題 一直以后FCKeditor的文件管理部分的安全是個(gè)值得注意,但很多人沒(méi)注意到的地方,雖然FCKeditor在各個(gè)Release版本中一直存在的一個(gè)功能就是對(duì)上傳文件類型進(jìn)行過(guò)濾,但是她沒(méi)考慮過(guò)另一個(gè)問(wèn)題:到底允許誰(shuí)能上傳?到底誰(shuí)能瀏覽服務(wù)器文件?

37、之前剛開始用FCKeditor時(shí),我就出現(xiàn)過(guò)這個(gè)問(wèn)題,還好NetRube(FCKeditor中文化以及FCKeditor ASP版上傳程序的作者)及時(shí)提醒了我,做法是去修改FCK上傳程序,在里面進(jìn)行權(quán)限判斷,并且再在fckconfig.js里把相應(yīng)的一些功能去掉。但隨之FCK版本的不斷升級(jí),每升一次都要去改一次配置程序fckconfig.js,我發(fā)覺(jué)厭煩了,就沒(méi)什么辦法能更好的控制這種配置么?事實(shí)上,是有的。 在fckconfig.js里面,有關(guān)于是否打開上傳和瀏覽服務(wù)器的設(shè)置,在創(chuàng)建FCKeditor時(shí),通過(guò)程序來(lái)判斷是否創(chuàng)建有上傳瀏覽功能的編輯器。首先,我先在fckconfig.js里面把

38、所有的上傳和瀏覽設(shè)置全設(shè)為false,接著我使用的代碼如下: ASP版本: JAVASCRIPT版本: var oFCKeditor = new FCKeditor( fbContent ) ; oFCKeditor.ConfigLinkBrowser = true ; oFCKeditor.ConfigImageBrowser = true ; oFCKeditor.ConfigFlashBrowser = true ; oFCKeditor.ConfigLinkUpload = true ; oFCKeditor.ConfigImageUpload = true ; oFCKeditor.

39、ConfigFlashUpload = true ; oFCKeditor.ToolbarSet = Basic ; oFCKeditor.Width = 100% ; oFCKeditor.Height = 200 ; oFCKeditor.Value = ; oFCKeditor.Create() ; FCKPageCtotype.Execute = function() window.alert(It works!); FCKeditor在ASP環(huán)境中配置使用 先說(shuō)一下我的測(cè)試環(huán)境:XPSP2,IIS5.1,F(xiàn)CKeditor2.0 在IIS上建立一個(gè)新的站點(diǎn),我直接

40、取名為FCKeditor 在DW里建立一個(gè)相對(duì)應(yīng)的站點(diǎn),測(cè)試服務(wù)器為本機(jī),支持VBScript 下載FCKeditor2.0,這個(gè)東西是開源的,網(wǎng)上能下到的地方很多,自己找去 下載下來(lái)的應(yīng)該是壓縮包,解壓到FCKeditor站點(diǎn)根目錄,什么都不需要更改,直接就可以開始調(diào)用了。等你會(huì)了的時(shí)候,會(huì)發(fā)現(xiàn)簡(jiǎn)單得要死去! 在站點(diǎn)根目錄下,新建一個(gè)index.asp頁(yè)面,段內(nèi)加如下代碼(調(diào)用編輯器): 加了這一段別忘了在index.asp前面第二行加上 把fckeditor.asp包含進(jìn)來(lái)。切記切記! 就這么簡(jiǎn)單! 現(xiàn)在你只要把這個(gè)編輯器當(dāng)成一個(gè)控件來(lái)使用,提取它的數(shù)據(jù)時(shí)用:request(logbody

41、) 現(xiàn)在松口氣吧。測(cè)試成功了。里面有些設(shè)置,去網(wǎng)上找些高級(jí)的使用說(shuō)明來(lái)看吧。 FCKeditor使用初步 作者:檸檬園主 FCKeditor 2.0版終于出來(lái)了,之所以用“終于”這個(gè)詞,是因?yàn)樵谶@一版本上加上了眾望所歸的FLASH插入功能??梢哉f(shuō)在所有的在線編輯器中,F(xiàn)CKeditor是目前互聯(lián)網(wǎng)上最好的編輯器,功能強(qiáng)大,支持多種瀏覽器,無(wú)平臺(tái)限制,可以和多種WEB語(yǔ)言融合,多語(yǔ)言支持,開源等 對(duì)于一個(gè)全新的網(wǎng)站,F(xiàn)CKeditor就可以直接拿過(guò)來(lái)用了,不需要進(jìn)行什么修改。但是對(duì)于絕大多數(shù)的已有網(wǎng)站而言,F(xiàn)CKeditor的一些設(shè)置并不適合自己的使用,這篇文章旨在告訴你簡(jiǎn)單的修改FCKedit

42、or以方便您的網(wǎng)站的使用。 第一項(xiàng)工作就是對(duì)這個(gè)功能宏大的編輯器進(jìn)行精簡(jiǎn),當(dāng)然是文件精簡(jiǎn)而非功能精簡(jiǎn)化。在這里我以asp版的FCKeditor為例進(jìn)行,進(jìn)入到FCKeditor 2.0文件夾下,先把以“_”為開頭的文件夾統(tǒng)統(tǒng)刪除,這些文件夾里放的是范例或是一些其它工具。其實(shí)也就是只保留editor文件夾、fckconfig.js、fckeditor.asp、fckeditor.js、fckstyles.xml、fcktemplates.xml就可以了,最外層的精簡(jiǎn)化完畢,進(jìn)入到editor文件夾內(nèi),先把“_source”文件夾刪除,這里是一些源文件,對(duì)于使用來(lái)說(shuō)沒(méi)什么用處。 進(jìn)入images文

43、件夾,刪除smiley文件夾,些文件是放表情圖標(biāo)的,由于接下來(lái)我會(huì)用我自己的表情圖標(biāo),先把他們的刪除,當(dāng)然,如果你想用這里的表情圖標(biāo)那就不要?jiǎng)h掉了。退出 images再進(jìn)入lang文件夾內(nèi),這里的東西可以來(lái)個(gè)大清洗了,只保留fcklanguagemanager.js、zh-cn.js、en.js、zh.js這四個(gè)文件,第一個(gè)文件是語(yǔ)言配置文件,有了它才能和fckconfig.js里的設(shè)置成對(duì)對(duì)應(yīng)上相應(yīng)的語(yǔ)言文件,zh-cn.js是簡(jiǎn)體中文語(yǔ)言包,en.js就不用說(shuō)了吧,zh.js是繁體中文的。怎么樣?一下子少了幾百K,爽吧 再退出lang文件夾,進(jìn)入skin文件夾,如果你想使用fckedito

44、r默認(rèn)的這種奶黃色,那就把除了default文件夾外的另兩個(gè)文件夾直接刪除,如果想用別的,那就自己考慮了,不過(guò)我給你個(gè)建議,如果不想用默認(rèn)的,那就選那個(gè)silver,因?yàn)殂y色也就是灰色和任何顏色配起來(lái)都不會(huì)難看,而那個(gè)office2003的皮膚,反正我是非常不喜歡的,并且圖片相對(duì)也比較大,又增加了下載時(shí)間,不要! 精簡(jiǎn)的最后一步,退出skin文件夾,再進(jìn)入filemanager,如果你用的不是最新版的fckeditor的話,那這里就一個(gè)文件夾browser,新版的還有一個(gè)upload文件夾。一個(gè)個(gè)來(lái),先進(jìn)入到filemanager/browser/default/connectors/下,因?yàn)?/p>

45、我是用的asp的,所以除asp文件夾外,全部刪除。然后再進(jìn)入filemanager/upload/下,同樣,只留asp文件夾,至此,編輯器的精簡(jiǎn)化已經(jīng)結(jié)束了,接下來(lái),我們對(duì)編輯器進(jìn)行設(shè)置修改。 第一個(gè)修改的文件,也就是fckeditor總配置文件,位于根目錄下的fckconfig.js文件。請(qǐng)根據(jù)下面的列表進(jìn)行(以fckeditor 2.0版的為準(zhǔn)): 找到第20行 FCKConfig.DefaultLanguage = en ;改為 FCKConfig.DefaultLanguage = zh-cn ;設(shè)置默認(rèn)語(yǔ)言為簡(jiǎn)體中文 找到第40行 FCKConfig.TabSpaces = 0 ;

46、改為FCKConfig.TabSpaces = 1 ; 即在編輯器域內(nèi)可以使用Tab鍵。 如果你的編輯器還用在網(wǎng)站前臺(tái)的話,比如說(shuō)用于留言本或是日記回復(fù)時(shí),那就不得不考慮安全了,在前臺(tái)千萬(wàn)不要使用Default的toolbar,要么自定義一下功能,要么就用系統(tǒng)已經(jīng)定義好的Basic,也就是基本的toolbar, 找到第64行 FCKConfig.ToolbarSetsBasic = Bold,Italic,-,OrderedList,UnorderedList,-,/*Link,*/Unlink,-,Style,FontSize,TextColor,BGColor,-,Smiley,Speci

47、alChar,Replace,Preview ; 這是我改過(guò)的Basic,把圖像功能去掉,把添加鏈接功能去掉,因?yàn)閳D像和鏈接和flash和圖像按鈕添加功能都能讓前臺(tái)頁(yè)直接訪問(wèn)和上傳文件,要是這兒不改直接給你上傳個(gè)木馬還不馬上玩完?但是光這樣還不行,fckeditor還支持編輯域內(nèi)的鼠標(biāo)右鍵功能。 找到第73行 FCKConfig.ContextMenu = Generic,/*Link,*/Anchor,/*Image,*/Flash,Select,Textarea,Checkbox,Radio,TextField,HiddenField,/*ImageButton,*/Button,BulletedList,Numb

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論