首先,FCKEDITOR的性能是非常好的,用戶只需很少的時間就可以載入FCKEDITOR所需文件.對于其他在線編輯器來說,這幾乎是個很難解決的難題,因為在開啟編輯器時需要裝載太多的文件.比如CUTEEDITOR,雖然功能比FCKEDITOR還要強大,可是,它本身也夠龐大了,至于FREETEXTBOX等,其易用性與FCKEDITOR相比,尚有差距,可以說,FCKEDITOR是一個別具匠心的在線編輯器,它里面融入了作者高深的面向對象的JAVASCRIPT功力,集易用性與強大的功能與一體.
.與編輯器相關的所有圖像,腳本以及調用頁
.語言文件
.編輯器的皮膚文件
.工具樣的貼圖等
這些將導致在服務器和客戶端間產生相當的流量.如果有許多文件被調用,那么即便每個文件很小.也會讓用戶等得不耐煩.
在2.0版中,開發人員有兩種方法來解決這個問題.
那就是指定裝載順序和腳本壓縮
裝載順序
從2.0版開始,編輯器按以下步驟裝載資源:
.基本頁(就是編輯器所在頁)以及裝入編輯器的JS腳本
.用來建立編輯器的腳本
.編輯器的語言和皮膚.
.建立編輯器.
.載入預置的編輯文檔內容.
.從現在開始,用戶可以閱讀和編輯文檔了,不過,拖拽支持以及工具欄都是不可用的
.載入編輯器引擎腳本
.建立工具欄,并且可用
.從現在開始,編輯器的所有功能都已經完整
.載入工具欄圖標
腳本壓縮
在打包任何新版本時,編輯器的JS腳本將會進行預處理.預處理步驟如下:
.移除所有代碼注釋
.移除所有無用的空白字符.
.將腳本合并成幾個文件
使用上面的方法,我們可以將腳本文件的大小壓縮到原來的50%.
壓縮后,原始的代碼仍然存在于一個名為_Source的文件夾中
如何打包?
編輯器已經自帶了打包程序,它位于FCKEDITOR的根文件夾中_PACKAGER文件夾中,名為Fckeditor.Packager.exe,將其復制到FCKEDITOR根文件夾中并運行,即可自動將JS腳本打包并壓縮
需要注意的是該程序是一個.NET程序,必須安裝.NET FRAMEWORK才能使用
想要獲取支持?
如果你捐贈15000歐元,你就可以獲得1年的免費技術支持(比較貴的說,相當于人民幣15萬,不過西歐的費用相當驚人)
如何安裝?
1.下載最新版的FCKEDITOR
2.解壓縮到你的站點根文件夾中名為FCKEDITOR的文件夾中(名稱必須為FCKEDITOR,因為配置文件中已經使用此名稱來標示出FCKEDITOR的位置)
3.現在,編輯器就可以使用了,如果想要查看演示,可以按下面方法訪問:
http://<your-site>/FCKeditor/_samples/default.html
注意:你可以將FCKEDITOR放置到任何文件夾,默認情況下,將其放入到FCKEDITOR文件夾是最為簡單的方法.如果你放入的文件夾使用別的名稱,請修改配置文件夾中編輯器BasePath參數,如下所示:
oFckeditor.BasePath="/Components/fckeditor/";
另外,FCKEDITOR文件夾中所有以下劃線開頭的文件夾及文件,都是可選的,可以安全的從你的發布中刪除.它們并不是編輯器運行時必需的
如何將FCKEDITOR整合進我的頁面?
由于目前的版本提供的FCKEDITOR僅提供了JAVASCRIPT式的整合,因此,這里僅講述如何應用JAVASCRIPT來整合FCKEDITOR到站點中,當然,其他各種語言的整合,你可以參考_samples文件夾中的例子來完成
1,假如編輯器已經安裝在你的站點的/FCKEDITOR/文件夾下.那么,第一步我們需要做的就是在頁面的HEAD段中放入SCRIPT標記以引入JAVASCRIPT整合模塊.例如:
<script type="text/javascript" src="/fckeditor/fckeditor.js"></script>
其中路徑是可更改的
2,現在,FCKEDITOR類已經可以使用了.有兩個方法在頁面中建立一個FCKEDITOR編輯器:
方法1:內聯方式(建議使用):在頁面的FORM標記內需要插入編輯器的地方置入以下代碼:
script type="text/javascript">
var oFCKeditor = new FCKeditor( 'FCKeditor1' ) ;
oFCKeditor.Create() ;
</script>
方法2:TEXTAREA標記替換法(不建議使用):在頁面的ONLOAD事件中,添加以下代碼以替換一個已經存在的TEXTAREA標記
<html>
<head>
<script type="text/javascript">
window.onload = function()
{
var oFCKeditor = new FCKeditor( 'MyTextarea' ) ;
oFCKeditor.ReplaceTextarea() ;
}
</script>
</head>
<body>
<textarea id="MyTextarea" name="MyTextarea">This is <b>the</b> initial value.</textarea>
</body>
</html>
3.現在,編輯器可以使用了
FCKEDITOR類參考:
下面是用來在頁面中建立編輯器的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?
FCKEDITOR提供了一套用于定制其外觀,特性及行為的設置集.主配置文件名為Fckconfig.js
你既可以編輯主配置文件,也可以自己定義單獨的配置文件.配置文件使用JAVASCRIPT語法.
修改后,在建立編輯器時,可以使用以下語法:
var oFCKeditor = new FCKeditor( 'FCKeditor1' ) ;
oFCKeditor.Config['CustomConfigurationsPath'] = '/myconfig.js' ;
oFCKeditor.Create() ;
提醒:當你修改配置后,請清空瀏覽器緩存以查看效果
配置選項:
AutoDetectLanguage=true/false 自動檢測語言
BaseHref="" 相對鏈接的基地址
ContentLangDirection="ltr/rtl" 默認文字方向
ContextMenu=字符串數組,右鍵菜單的內容
CustomConfigurationsPath="" 自定義配置文件路徑和名稱
Debug=true/false 是否開啟調試功能,這樣,當調用FCKDebug.Output()時,會在調試窗中輸出內容
DefaultLanguage="" 缺省語言
EditorAreaCss="" 編輯區的樣式表文件
EnableSourceXHTML=true/false 為TRUE時,當由可視化界面切換到代碼頁時,把HTML處理成XHTML
EnableXHTML=true/false 是否允許使用XHTML取代HTML
FillEmptyBlocks=true/false 使用這個功能,可以將空的塊級元素用空格來替代
FontColors="" 設置顯示顏色拾取器時文字顏色列表
FontFormats="" 設置顯示在文字格式列表中的命名
FontNames="" 字體列表中的字體名
FontSizes="" 字體大小中的字號列表
ForcePasteAsPlainText=true/false 強制粘貼為純文本
ForceSimpleAmpersand=true/false 是否不把&符號轉換為XML實體
FormatIndentator="" 當在源碼格式下縮進代碼使用的字符
FormatOutput=true/false 當輸出內容時是否自動格式化代碼
FormatSource=true/false 在切換到代碼視圖時是否自動格式化代碼
FullPage=true/false 是否允許編輯整個HTML文件,還是僅允許編輯BODY間的內容
GeckoUseSPAN=true/false 是否允許SPAN標記代替B,I,U標記
IeSpellDownloadUrl=""下載拼寫檢查器的網址
ImageBrowser=true/false 是否允許瀏覽服務器功能
ImageBrowserURL="" 瀏覽服務器時運行的URL
ImageBrowserWindowHeight="" 圖像瀏覽器窗口高度
ImageBrowserWindowWidth="" 圖像瀏覽器窗口寬度
LinkBrowser=true/false 是否允許在插入鏈接時瀏覽服務器
LinkBrowserURL="" 插入鏈接時瀏覽服務器的URL
LinkBrowserWindowHeight=""鏈接目標瀏覽器窗口高度
LinkBrowserWindowWidth=""鏈接目標瀏覽器窗口寬度
Plugins=object 注冊插件
PluginsPath="" 插件文件夾
ShowBorders=true/false 合并邊框
SkinPath="" 皮膚文件夾位置
SmileyColumns=12 圖符窗列數
SmileyImages=字符數組 圖符窗中圖片文件名數組
SmileyPath="" 圖符文件夾路徑
SmileyWindowHeight 圖符窗口高度
SmileyWindowWidth 圖符窗口寬度
SpellChecker="ieSpell/Spellerpages" 設置拼寫檢查器
StartupFocus=true/false 開啟時FOCUS到編輯器
StylesXmlPath="" 設置定義CSS樣式列表的XML文件的位置
TabSpaces=4 TAB鍵產生的空格字符數
ToolBarCanCollapse=true/false 是否允許展開/折疊工具欄
ToolbarSets=object 允許使用TOOLBAR集合
ToolbarStartExpanded=true/false 開啟是TOOLBAR是否展開
UseBROnCarriageReturn=true/false 當回車時是產生BR標記還是P或者DIV標記
如何自定義樣式列表呢?
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中的樣式是上下文敏感的,也就是說,選擇不同的對象,僅會顯示針對這類對象定義的樣式
拼寫檢查
FCKEDITOR帶了兩種拼寫檢查工具,一種是ieSpell,默認情況下使用這種,使用這種方式的拼寫檢查,要求客戶下載并安裝iespell這個小軟件,另外,也提供SpellPager的方式來進行拼寫檢查,不過,由于SPELLPAGER是由PHP編寫的服務器端腳本,因此,要求你的WEB服務器必須支持PHP腳本語言方可
更改拼寫檢查器的方式請參見有關配置文件的詳細說明
壓縮腳本
為了提供腳本載入的效率,FCKEDITOR采用以下方法對腳本盡量壓縮以減少腳本尺寸:
1,移除掉腳本中的注釋
2.移除掉腳本中所有無意義的空白
另外,FCKEDITOR還提供了一個專門用于壓縮腳本的工具以便 你在發布時能減小文件尺寸,
你可以將_Packager文件夾中的Fckeditor.Packager.exe復制到FCKEDITOR根文件夾來運行并壓縮腳本
本地化FCKEDITOR
如果FCKEDITOR沒有提供您所需要的語言(實際上全有了),你也可以自行制作新的語言
,你只需要復制出EN.JS,然后在其基礎上進行翻譯.另外,語言名稱與對應的腳本文件名必須遵循RFC 3066標準,但是,需要小寫,例如:Portuguess Language對應的腳本文件名必須為pt.js
如果需要針對某個國家的某種語系,則可以在語系縮寫后加上橫線及國家縮寫即可
在使用時,系統會自動偵測客戶端語系及國別而運用適當的界面語言.
當建立一種新的語言后,你必須在"Edit/lang/fcklanguagemanager.js"中為其建立一個條目,如下所示:
FCKLanguageManager.AvailableLanguages =
{
en : 'English',
pt : 'Portuguese'
}
需要提醒的是,文件必須保存為UTF-8格式
如何與服務器端腳本進行交互?
請查看例子以得到相關內容
另外,在ASP.NET中以以下步驟使用
1.把FCKEDITOR添中到工具箱
2.托拽FCKEDITOR控件到頁面
3.為其指定名稱
4.FCKEDITOR類的所有屬性不光可以在代碼中使用,而且可以作為FCKEDITOR控件的屬性直接使用,例如,要改變皮膚,可以在UI頁面中指定SkinPath="/fckeditor/editor/skins/office2003"即可,其實FCKEDITOR的ASP.NET版本可以做得更好,你可以找到FCKEDITOR ASP.NET 2.1的源文件,然后修改該控件的設計,為其暴露更多有用的屬性,重新編譯即可
5,POSTBACK后的數據,使用FCKEDITOR控件的value屬性獲得
6.默認狀態下,FCKEDITOR作者并沒有提供特定于ASP.NET的文件上傳及文件瀏覽器,不過,你可以輕易的在FILEMANANGER的ASP.NET文件夾中找到空白的ASP.NET版文件瀏覽器,加入你自己用于瀏覽/上傳的代碼即可
7.由于默認狀態下,ASP.NET不允許提交含有HTML及JAVASCRIPT的內容,因此,你必須將使用FCKEDITOR的頁面的ValidateRequest設為false.(<%@page validteRequest="false" %>即可)
8.FCKEDITOR 1.6版與FCKEDITOR2.0版相差不是很大,不過,2.0版加入了JAVASCRIPT方式
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
精簡FCKEDITOR2.0
FCKeditor 2.0版終于出來了，之所以用“終于”這個詞，是因為在這一版本上加上了眾望所歸的FLASH插入功能。可以說在所有的在線編輯器中，FCKeditor是目前互聯網上最好的編輯器，功能強大，支持多種瀏覽器，無平臺限制，可以和多種WEB語言融合，多語言支持，開源等~~
對于一個全新的網站，FCKeditor就可以直接拿過來用了，不需要進行什么修改。但是對于絕大多數的已有網站而言，FCKeditor的一些設置并不適合自己的使用，這篇文章旨在告訴你簡單的修改FCKeditor以方便您的網站的使用。
第一項工作就是對這個功能宏大的編輯器進行精簡，當然是文件精簡而非功能精簡化。在這里我以asp版的FCKeditor為例進行，進入到FCKeditor 2.0文件夾下，先把以“_”為開頭的文件夾統統刪除，這些文件夾里放的是范例或是一些其它工具。其實也就是只保留editor文件夾、fckconfig.js、fckeditor.asp、fckeditor.js、fckstyles.xml、fcktemplates.xml就可以了，最外層的精簡化完畢，進入到editor文件夾內，先把“_source”文件夾刪除，這里是一些源文件，對于使用來說沒什么用處。
進入images文件夾，刪除smiley文件夾，些文件是放表情圖標的，由于接下來我會用我自己的表情圖標，先把他們的刪除，當然，如果你想用這里的表情圖標那就不要刪掉了。退出 images再進入lang文件夾內，這里的東西可以來個大清洗了，只保留fcklanguagemanager.js、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/下，因為我是用的asp的，所以除asp文件夾外，全部刪除。然后再進入filemanager/upload/下，同樣，只留asp文件夾，至此，編輯器的精簡化已經結束了，接下來，我們對編輯器進行設置修改。
第一個修改的文件，也就是fckeditor總配置文件，位于根目錄下的fckconfig.js文件。請根據下面的列表進行（以fckeditor 2.0版的為準）：
找到第20行 FCKConfig.DefaultLanguage = 'en' ;改為 FCKConfig.DefaultLanguage = 'zh-cn' ;設置默認語言為簡體中文
找到第40行 FCKConfig.TabSpaces = 0 ; 改為FCKConfig.TabSpaces = 1 ; 即在編輯器域內可以使用Tab鍵。
如果你的編輯器還用在網站前臺的話，比如說用于留言本或是日記回復時，那就不得不考慮安全了，在前臺千萬不要使用Default的toolbar，要么自定義一下功能，要么就用系統已經定義好的Basic，也就是基本的toolbar，
找到第64行：
FCKConfig.ToolbarSets["Basic"] = [
['Bold','Italic','-','OrderedList','UnorderedList','-',/*'Link',*/'Unlink','-','Style','FontSize','TextColor','BGColor','-','Smiley','SpecialChar','Replace','Preview']
] ;
這是我改過的Basic，把圖像功能去掉，把添加鏈接功能去掉，因為圖像和鏈接和flash和圖像按鈕添加功能都能讓前臺頁直接訪問和上傳文件，要是這兒不改直接給你上傳個木馬還不馬上玩完？但是光這樣還不行，fckeditor還支持編輯域內的鼠標右鍵功能。
找到 第77行：
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' ;
接下來就設置上傳功能了，還是以ASP為例，其實fck默認的就是asp的，把100行以下的所有被注釋掉的代碼全部刪掉就行，然后再把下面所有有關于browser.html和upload.asp的后面的?Type=XX都改成Type=YY，其中YY為你想保存文件的文件夾名稱。
而如果你還想用自己的表情圖標的話，那跳到131行，改掉那個表情圖標的文件夾地址，以及下面的表情圖標的文件名，再下面那三個數字是每行顯示表情數及彈出窗口的寬和高了，這個的大小要根據您的表情圖標排列的窗口的大小而定了。OK，總配置文件修改結束。
接下來是編輯器位置的設置，我的習慣是把editor放在根目錄下，最開始所述的五個文件也放在根目錄下（Tips:建議放在根目錄下，并且建議使用時設置路徑也采用絕對路徑，如"/fckeditor/"，而我的習慣的設置是"/"），這樣有利于fckeditor的更新升級，并且網站下所有文件夾都可以任意調用，不存在其它文件夾名變了而其它地方就無法使用編輯器的問題。
打開fckeditor.asp文件，找到 sBasePath = "/fckeditor/"改為 sBasePath = "/"
打開fckeditor.js文件，找到 this.BasePath = '/fckeditor/' ;改為 this.BasePath = '/' ;
編輯器域內默認的顯示字體為12px，而我的主頁默認字體為14px，所以看著就很不舒服，想要修改可以通過修改樣式表來達到要求，打開/editor/css/fck_editorarea.css，把第4行改為 font-size: 14px;即可。
接下來就是上傳文件的設置了，這個比較麻煩，請仔細操作。
打開\editor\filemanager\browser\default\frmresourcetype.html，找到第15行，插入“ ['uploadfile','uploadfile'],”配合上剛才在fckconfig.js里的設置，那么我的上傳文件路徑就是/uploadfile，當然你也可以改成你想要的文件夾，但這里的名稱一定要和fckconfig.js里的那個“Type=YY”里的YY一致才行。
還沒完，繼續進入到editor\filemanager\browser\default\connectors\asp，打開config.asp，先把ConfigIsEnabled = False改成為ConfigIsEnabled = True，要不是沒法上傳文件的，再把ConfigUserFilesPath = "/UserFile"改成我想要的ConfigUserFilesPath = "/"。
接著在“Set ConfigDeniedExtensions = CreateObject( "Scripting.Dictionary" )”后面加入
ConfigAllowedExtensions.Add "uploadfile", ""
ConfigDeniedExtensions.Add "uploadfile", ""
同理，這里的設置也是要和上面以及fckconfig.js里面對應的。
還有一個上傳，就是快速上傳，這個功能是在fckeditor 2.0里才有的，以前的版本沒這個功能。進入\editor\filemanager\upload\asp，同樣打開config.asp，也同樣的把ConfigIsEnabled = False 設置成 ConfigIsEnabled = True，我這里把ConfigUserFilesPath = "/UserFiles/"改成我想要的 ConfigUserFilesPath = "/uploadfile/"& Year(Date()) &"-"& Month(Date()) &"/"，因為我的上傳文件是放在uploadfile文件夾下，并且是按月分開放置的。快速上傳，不會讓你選擇文件夾，而是通過這里的設置直接上傳的，這兒設置如果和前面的設置配合不好的話，你的文件就會被上傳得亂七八糟，很不方便管理。接前重復前一個config.asp里的操作，在后面加上
ConfigAllowedExtensions.Add "uploadfile", ""
ConfigDeniedExtensions.Add "uploadfile", ""
接下來呢，就講一下如何創建自己的在線編輯器，這里以ASP和JS版的為例，ASP版示例代碼，一般用于后臺操作：
<%
Dim oFCKeditor
Set oFCKeditor = New FCKeditor
oFCKeditor.BasePath = "/"
oFCKeditor.ToolbarSet = "Default"
oFCKeditor.Width = "100%"
oFCKeditor.Height = "400"
oFCKeditor.Value = rs("logbody")
oFCKeditor.Create "logbody"
%>
ASP版的，當然只能用在以.asp為擴展名的頁面中，如果你在前在fckedito.asp里設置過BasePath為"/"的話，這里就可以省掉第三行，ASP版的只有一個Create函數。建議在修改一篇內容時用ASP版的。
接下來看JS版的：
<script type="text/javascript">
var oFCKeditor = new FCKeditor( 'logbody' ) ;
oFCKeditor.BasePath = '/' ;
oFCKeditor.ToolbarSet = 'Basic' ;
oFCKeditor.Width = '100%' ;
oFCKeditor.Height = '400' ;
oFCKeditor.Value = '' ;
oFCKeditor.Create() ;
</script>
BasePath的設置同上所述，JS版的可用于任何網頁中，甚至用于html頁面，因為其是客戶端生成的，這樣的好處就是一可以減小網絡流量，因為編輯器文件只需下載一次，二是可以由客戶端定義什么時候顯示，由于fckeditor初始化需要一定時間，在這一點上JS就很有作用了。
另外，JS版的還有一個功能函數就是ReplaceTextarea()函數，可以替換指定的TextArea，拿我的網站的日志的回復部分示例：
<script type="text/javascript">
<!--
function showFCK(){
var oFCKeditor = new FCKeditor( 'fbContent' ) ;
oFCKeditor.BasePath = '/' ;
oFCKeditor.ToolbarSet = 'Basic' ;
oFCKeditor.Width = '100%' ;
oFCKeditor.Height = '200' ;
oFCKeditor.Value = '' ;
//oFCKeditor.Create() ;
oFCKeditor.ReplaceTextarea() ;
//document.blog_feedback.blogsubmit.disabled = '';
document.blog_feedback.blogsubmit.style.display = '';
document.blog_feedback.openFCK.disabled = 'true';
document.blog_feedback.openFCK.style.display = 'none';
}
//-->
</script>
把其寫成一個簡單的函數，當用戶顯示打開編輯器時才生成這個fckeditor，不用每次刷新頁面都去初始化一個編輯器，頁面的速度就會快多了。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
用FCKeditor整合MT
證所周知MT是一個功能極其強大的BLOG程序，但是最為 人所詬病的地方就是它只有一個很簡陋的編輯器，這讓用戶在排版的時候很不舒服。今天找了幾個WYSIWYG的開源編輯器，最后選定了強大的FCKeditor，關鍵是他對各種瀏覽器的支持都很好。
目前FCKeditor的最新版本是2.0 RC3，下載后解壓到你的STATIC_URI目錄，然后在mt\tmpl\cms建立一個新模板，文件名隨便起：
CODE：
<script type="text/javascript" src="<TMPL_VAR NAME=STATIC_URI>FCKeditor/fckeditor.js"></script>
<script type="text/javascript">window.onload = function()
{
var oFCKeditor = new FCKeditor( 'text' );
oFCKeditor.Width = 580;
oFCKeditor.Height = 400;
oFCKeditor.CheckBrowser = true;
oFCKeditor.ReplaceTextarea();
var pFCKeditor = new FCKeditor('text_more');
pFCKeditor.Width = 580;
pFCKeditor.Height = 400;
pFCKeditor.CheckBrowser = true;
pFCKeditor.ReplaceTextarea();
}
</script>
然后編輯你的edit_entry.tmpl，在<TMPL_INCLUDE NAME="header.tmpl">后面加上一句<TMPL_INCLUDE NAME="xxx.tmpl">，大功告成~！
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
fckditor的網站地址：
http://www.fckeditor.net/
下載地址：
http://xxxz.net/DownSoft/?softid=6235&pathid=0
fckditor Html的演示:
http://www.fckeditor.net/demo/default.html
下載了過后看見里面有個叫 _samples 的文件夾 里面全是演示腳本,請選擇自己服務器支持的的腳本,這時我打開了ASP文件夾,里面又有
sample01.asp sample02.asp sample03.asp sample04.asp 還有一個 sampleposteddata.asp 我用IIS調試了這幾個ASP文件得到的結果寫出來一下
方便討論
sample01.asp是最普通的就是跟上面演示的差不多
sample02.asp可以選擇 language 中文簡體請選擇zh-cn 繁體就是 zh
sample03.asp可以選擇 default(默認) 和 basic
sample04.asp可以選擇皮膚 里面的風格有default,office2003,silver 只有silver的風格最好看
sampleposteddata.asp是一個數據的驗證,上面的文件都有這樣一句話
Quote:
<form action="sampleposteddata.asp" method="post" target="_blank">
隨便在一個sample0X.asp里面按submit就會得到在sampleposteddata.asp得到這樣的結果
(注意:我沒有修改,里面有一段默認的話:This is some sample text. You are using FCKeditor.)
Quote:
FCKeditor - Samples - Posted Data
This page lists all data posted by the form.
--------------------------------------------------------------------------------
Field Name Value
FCKeditor1 This is some <strong>sample text</strong>. You are using <a href="http://www.fckeditor.net/">FCKeditor</a>.
這時我又進一步看了看代碼發現了
調用這個HTML編輯器必須要包含一個叫 fckeditor.asp 的文件,還有調用代碼:
定義路徑: Dim sBasePath
sBasePath = "fckeditor/"
文件夾的取名叫 fckeditor 這里的 fckeditor/ 是相對路徑 意思就是說html編輯器的文件在fckeditor里面 不要忘了還有一個 / 符號哦
定義一些相關東西: Dim oFCKeditor
Set oFCKeditor = New FCKeditor '這個由于語言能力問題,說不清楚...
oFCKeditor.BasePath = sBasePath 'oFCKeditor的路徑為sBasePath
oFCKeditor.Config("AutoDetectLanguage") = False '自動選擇語言關了的,好象是的
oFCKeditor.Config("DefaultLanguage") = "zh-cn" '默認語言為中文簡體
oFCKeditor.Value = "" '默認內容為空
oFCKeditor.Create "Message" '這個就是上面提到的 Field Name
這里的Message跟<textarea name="message">一樣,oFCKeditor.Create "Message" 就是創建一個name 叫 Message
如果要得到這里面的內容就可以這樣
DIM post_Message
post_Message=CheckStr(request.form("Message"))
設置<textarea>的高度,寬度在fckeditor.asp里面
Quote:
Private Sub Class_Initialize()
sBasePath = "/FCKeditor/"
sWidth = "100%"
sHeight = "200"
sToolbarSet = "Default"
sValue = ""
Set oConfig = CreateObject("Scripting.Dictionary")
End Sub
上面的內容都知道了吧,sToolbarSet上面提到過可以是Default,如果你喜歡更簡單的,可以該為basic..
打開 _testcases 是講一些使用方法 它直接調用fckeditor.js
最重要的文件都在 editor 文件夾里面
這里面lang語言包可以只留zh-cn.js 和 zh.js 同時還要修改 _translationstatus.txt 其他的可以刪除 有興趣自己去研究一下吧..
大概內容好象就是這些了,其余的就看你們怎么的了,L-blog如果用html編輯器可能還要用更加嚴密的過濾方式
如果非要用的話可以在 blog_content 里面增加一個log_edittype字段 判斷是 UBB編輯器 還是 HTML編輯器 和 PJblog 一樣
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
FCKDITOR2.0 for asp.net的范例及說明下載：
http://www.cnblogs.com/Files/Heroman/FCkEditorDemo.rar
本Blog純屬個人學習、工作需要，記錄相關資料。請不要發表任何有人身攻擊的言論，謝謝！ www.zhipsoft.cn
posted on 2007-12-02 00:02
ZhipSoft 閱讀(1248)
評論(1) 編輯 收藏 所屬分類:
Web開發