ASP.NET下FCKeditor配置方法全解

搞ASP.NET開發有一年時間了,做網站時常常用到在線HTML編輯器,一直用得是FCKeditor。FCKeditor在ASP.NET上的集成和配置,可以說搞得已經很清楚了。在網絡上得到過很多前輩同仁們的幫助,現在把自己的一點經驗貢獻出來,幫助需要幫助的人。

原創作品,轉載請註明出處。有不當的地方,敬請批評指正。

參考:
    舒健,在ASP.NET中如何使用FCKEditor,http://blog.csdn.net/fhbcn/archive/2008/05/10/2431559.aspx 。(應該是轉載的)
    三味書屋,FCKeditor使用方法,http://hi.baidu.com/howes/blog/item/529c7a8b6200bc16c8fc7ac5.html
    fckeditor.net,ASP.NET Integration,http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Integration/ASP.NET
    Mohannd Jahedur Rahman,Integrating FCKeditor in ASP.NET,http://www.blog.valenticabd.com/2008/07/20/integrating-fckeditor-in-aspnet.html


一、集成方法
    FCKeditor應用在ASP.NET上,需要兩組文件,一組是FCKeditor本身,另一個是用於ASP.NET的FCKeditor控件(分爲1.1和2.0兩個版本,這裏使用2.0版本)。

    1. 將FCKeditor加入到項目中
    解壓FCKeditor編輯器,得到文件夾fckeditor,複製此文件夾到Web應用的項目下(也可以是子孫目錄下)。
    解壓FCKeditor控件,在其子目錄bin/Release/2.0下有一個程序集。在Web應用的項目中引用該程序集。

    2. 在頁面中使用FCKeditor
    有兩種方式。
    (1)手工編碼
    在頁面中加入ASP.NET指令:
        <%@ Register Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>
    然後在需要的地方加入FCKeditor控件:
        <FCKeditorV2:FCKeditor id="FCKeditor1" runat="server" />
    (2)集成到Visual Studio工具箱
    打開一ASP.NET頁面,展開Toolbox,打開右鍵菜單,選擇“Choose Items ...”,在出現的“Choose Toolbox Items”會話框的“.NET Framework Components”選項卡中選擇“Browse”,找到並選中FCKeditor程序集,打開後回到“Choose Toolbox Items”窗口,點擊“OK”,完成控件導入。
    這時,在Toolbox的General分類下出現了一個名爲FCKeditor的控件,可以像使用Visual Studio內置控件一樣使用它。

    3. 配置FCKeditor編輯器路徑
    在頁面中,使用的是FCKeditor控件,該控件需要知道FCKeditor編輯器文件組的路徑。有兩種配置方法。
    (1)配置web.config
    在appSettings配置節中加入
        <add key="FCKeditor:BasePath" value="~/PathOfFCKeditor/" />
    使用這種配置方法後,對於項目

本文所採用的FCKeditor版本是FCKeditor 2.6.4和FCKeditor.NET 2.6.3,都是當前FCKeditor的最新版本http://www.fckeditor.net 上可以找到。搞ASP.NET開發有一年時間了,做網站時常常用到在線HTML編輯器,一直用得是FCKeditor。FCKeditor在ASP.NET上的集成和配置,可以說搞得已經很清楚了。在網絡上得到過很多前輩同仁們的幫助,現在把自己的一點經驗貢獻出來,幫助需要幫助的人。原創作品,轉載請註明出處。有不當的地方,敬請批評指正。參考: 舒健,在ASP.NET中如何使用FCKEditor,http://blog.csdn.net/fhbcn/archive/2008/05/10/2431559.aspx 。(應該是轉載的) 三味書屋,FCKeditor使用方法,http://hi.baidu.com/howes/blog/item/529c7a8b6200bc16c8fc7ac5.html 。 fckeditor.net,ASP.NET Integration,http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Integration/ASP.NET 。 Mohannd Jahedur Rahman,Integrating FCKeditor in ASP.NET,http://www.blog.valenticabd.com/2008/07/20/integrating-fckeditor-in-aspnet.html 。一、集成方法 FCKeditor應用在ASP.NET上,需要兩組文件,一組是FCKeditor本身,另一個是用於ASP.NET的FCKeditor控件(分爲1.1和2.0兩個版本,這裏使用2.0版本)。 1. 將FCKeditor加入到項目中 解壓FCKeditor編輯器,得到文件夾fckeditor,複製此文件夾到Web應用的項目下(也可以是子孫目錄下)。 解壓FCKeditor控件,在其子目錄bin/Release/2.0下有一個程序集。在Web應用的項目中引用該程序集。 2. 在頁面中使用FCKeditor 有兩種方式。 (1)手工編碼 在頁面中加入ASP.NET指令: <%@ Register Namespace="FredCK.FCKeditorV2" Assembly="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %> 然後在需要的地方加入FCKeditor控件: (2)集成到Visual Studio工具箱 打開一ASP.NET頁面,展開Toolbox,打開右鍵菜單,選擇&ldquo;Choose Items ...&rdquo;,在出現的&ldquo;Choose Toolbox Items&rdquo;會話框的&ldquo;.NET Framework Components&rdquo;選項卡中選擇&ldquo;Browse&rdquo;,找到並選中FCKeditor程序集,打開後回到&ldquo;Choose Toolbox Items&rdquo;窗口,點擊&ldquo;OK&rdquo;,完成控件導入。 這時,在Toolbox的General分類下出現了一個名爲FCKeditor的控件,可以像使用Visual Studio內置控件一樣使用它。 3. 配置FCKeditor編輯器路徑 在頁面中,使用的是FCKeditor控件,該控件需要知道FCKeditor編輯器文件組的路徑。有兩種配置方法。 (1)配置web.config 在appSettings配置節中加入 使用這種配置方法後,對於項目中任何一個頁面中用到的FCKeditor控件,都不用再配置其BasePath屬性。 (2)直接對用到的FCKeditor控件進行配置 在頁面代碼中設置FCKeditor的屬性BasePath爲FCKeditor編輯器文件組的路徑,或者在Page_Init事件處理器中設置其BasePath的值。 4. 配置FCKeditor編輯器文件上傳路徑 在web.config的appSettings配置節中加入 這樣,就完成了FCKeditor向ASP.NET頁面的集成工作。二、配置FCKeditor 按照FCKeditor的默認配置,可以完成一些常用的HTML可視化編輯工作,但在實際應用中,還需要對其做進一步的配置。FCKeditor控件的可配置屬性不多,且配置後只能作用於一個單一實例。實際上,需要對FCKeditor編輯器文件組中的通用配置文件/fckconfig.js和ASP.NET專用文件上傳管理代碼文件/editor/filemanager/connectors/aspx/config.ascx進行配置。 1. 配置控件語言 FCKeditor是自動探測瀏覽器所使用的語言編碼的,其默認語言是英文。修改配置行"FCKConfig.DefaultLanguage = 'en';"爲'zh-cn',採用中文爲默認語言。 2. 配置控件應用技術 FCKeditor默認是用於php技術的。修改配置行"var _FileBrowserLanguage = 'php';"和"var _QuickUploadLanguage = 'php';"爲'aspx',採用ASP.NET技術。 3. 配置Tab鍵 此文章ASP.NET下FCKeditor配置方法全解來自www.itqun.net

詳細出處參考:http://www.itqun.net/content-detail/103891.html

 

關鍵字:ASP.NET下FCKeditor配置方法全解 中任何一個頁面中用到的FCKeditor控件,都不用再配置其BasePath屬性。
    (2)直接對用到的FCKeditor控件進行配置
    在頁面代碼中設置FCKeditor的屬性BasePath爲FCKeditor編輯器文件組的路徑,或者在Page_Init事件處理器中設置其BasePath的值。

    4. 配置FCKeditor編輯器文件上傳路徑
    在web.config的appSettings配置節中加入
        <add key="FCKeditor:UserFilesPath" value="~/YourUploadFilePath" />
    
    這樣,就完成了FCKeditor向ASP.NET頁面的集成工作。


二、配置FCKeditor
    按照FCKeditor的默認配置,可以完成一些常用的HTML可視化編輯工作,但在實際應用中,還需要對其做進一步的配置。FCKeditor控件的可配置屬性不多,且配置後只能作用於一個單一實例。實際上,需要對FCKeditor編輯器文件組中的通用配置文件/fckconfig.js和ASP.NET專用文件上傳管理代碼文件/editor/filemanager/connectors/aspx/config.ascx進行配置。
    
    1. 配置控件語言
    FCKeditor是自動探測瀏覽器所使用的語言編碼的,其默認語言是英文。修改配置行"FCKConfig.DefaultLanguage    = 'en';"爲'zh-cn',採用中文爲默認語言。

    2. 配置控件應用技術
    FCKeditor默認是用於php技術的。修改配置行"var _FileBrowserLanguage   = 'php';"和"var _QuickUploadLanguage    = 'php';"爲'aspx',採用ASP.NET技術。

    3. 配置Tab鍵
    默認Tab鍵在FCKeditor中不可用,可以修改配置行"FCKConfig.TabSpaces    = 0;"爲1,啓用Tab鍵。

    4. 定製FCKeditor工具欄
    FCKConfig提供兩種工具欄配置。在配置行"FCKConfig.ToolbarSets["Default"] = [ ... ];"中定義了使用全部可用按鈕的配置(作爲工具欄的默認配置)。在配置行"FCKConfig.ToolbarSets["Basic"] = [ ... ];"中定義了一個精簡按鈕的工具欄配置。實際使用時,默認配置按鈕太多,精簡配置按鈕又太少。因此需要定製工具欄。
    配置值[ ... ]中是形式爲[[v, v2, .., vN], '/', [ ... ],...](vN表示要顯示的按鈕名字,'/'表示之後的按鈕組在下一行顯示)的按鈕分組的集合。如果不需要整個分組的按鈕,那麼就刪掉該分組(形式爲[ , , ...]);如果只是不需要分組中的某個按鈕,刪掉該按鈕。

    5. 定製可用的文本字體
    FCKeditor是外國人做的,默認使用的字體當然也是西文字體了。修改配置行"FCKConfig.FontNames = '...';",加入要使用的中文字體名,如宋體,楷體_GB2312等。
    FCKConfig默認使用HTML字體關鍵字來表示可選的字體大小,這存在着不同瀏覽器顯示效果不一致的問題。因此,建議修改配置行"FCKConfig.FontSizes  = '...';",去掉字體關鍵字值,加入像素值或磅值。(當然,在網頁裏定義了全局樣式表的話,就不需要修改這項設置了,但應該教會最終用戶如何設置字體達到最佳顯示效果。)

    6. 啓用文件上傳
    FCKeditor提供了非常強大和易用的文件上傳功能,但是默認配置裏,文件上傳功能不可用,這是基於安全的考慮。但我認爲訪問安全性控制應該由程序來做,不應由控件來做。
    在文件config.ascx中,修改CheckAuthentication()的返回值爲true。如果希望上傳具有多擴展名的文件,修改SetConfig()中ForceSingleExtension的值爲false。FCKeditor默認可以上傳文件、圖片、Flash和多媒體四種類型的文件,可以在SetConfig()中對AllowedTypes修改來增減允許的類型(這個類型可以在

關鍵字:ASP.NET下FCKeditor配置方法全解 後面的TypeConfig["TypeName"]中定義,比如在AllowedExtensions屬性中定製本類型允許的上傳文件擴展名,在DeniedExtensions裏定製不允許的上傳文件擴展名)。
    在文件fckconfig.js中,修改配置行"FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;"爲FCKConfig.LinkBrowserURL = FCKConfig.BasePath + 'filemanager/browser/default/browser.html?Type=File&Connector=' + encodeURIComponent( FCKConfig.BasePath + 'filemanager/connectors/' + _FileBrowserLanguage + '/connector.' + _FileBrowserExtension ) ;";修改配置行"FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension ;"爲"FCKConfig.LinkUploadURL = FCKConfig.BasePath + 'filemanager/connectors/' + _QuickUploadLanguage + '/upload.' + _QuickUploadExtension + '?Type=File' ;"。(在這個配置文件裏,看起來似乎Type=File是作爲默認參數的,但實際上不加這個參數的話,會出錯。)
   
    7. 其它配置
    對於這兩個配置文件中的配置屬性,從名字上很容易知道它們所代表的含義,基本上都可以定製。但要注意,屬性值的格式要正確。

三、將FCKeditor編輯器文件組ASP.NET化
    FCKeditor編輯器文件組包含了用於它所支持的各種應用技術的文件,所以,對於ASP.NET應用來說,有很多文件是不需要的。
    根目錄下,只保留文件夾editor,文件fckconfig.js、fckeditor.js、fckpackager.xml、fckstyles.xml和fcktemplates.xml。
    子目錄editor/filemanager/connectors下,只保留文件夾aspx。
詳細出處參考:http://www.itqun.net/content-detail/103891_3.html

 

發佈了34 篇原創文章 · 獲贊 3 · 訪問量 5萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章