FCKeditor文本編輯器的使用方法

FCKeditor是一個功能強大支持所見即所得功能的文本編輯器,可以爲用戶提供微軟office軟件一樣的在線文檔編輯服務。

它不需要安裝任何形式的客戶端,兼容絕大多數主流瀏覽器,支持ASP.Net、ASP、ColdFusion 、PHP、Jsp、Active-FoxPro、Lasso、Perl、ython 等編程環境。

官方網站 http://www.fckeditor.net/

官方文檔 http://wiki.fckeditor.net/

下載地址 http://www.fckeditor.net/download/default.html

FCKeditor安裝和配置

下載FCKeditor2.63.zip和FCKeditor.NET2.63版的2個zip包

(a)   FCKeditor_2.6.3是html文件、Javascript文件和圖片等資源文件

(b)   FCKeditor.Net_2.6.3.zip是一個ASP.NET控件DLL文件 

Asp.Net項目中添加對 FCKeditor 的引用

1. 項目上選擇添加引用找到FredCK.FCKeditorV2.dll或直接將FredCK.FCKeditorV2.dll複製到項目的Bin目錄中

2. 爲了方便開發,可以把FredCK.FCKeditorV2.dll控件也添加到VS的工具箱中

3. 配置Web.Config,在<appSettings>節點添加,如下所示:

<appSettings>

<!--FCKeditor文本編輯控件配置-->

<add key="FCKeditor.BasePath" value="~/FCKeditor/"/>

<add key="FCKeditor.UserFilesPath" value="/解決方案名/uploads"/> //UserFilesPath的文路徑可以在FCKeditor/editor/filemanager/connectors/aspx/config.ascx中更改

</appSettings>
4.網頁中使用
<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>
<body>
  <FCKeditorV2:FCKeditor ID="FCKeditor" runat="server" BasePath="~/FCKeditor/">//BasePath指定到FCKeditor的根目錄
  </FCKeditorV2:FCKeditor>
</body>

FCKeditor 的配置:

進入FCKeditor文件夾,編輯 fckconfig.js 文件

1、修改(改成自己當前使用的語言)

var _FileBrowserLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py

var _QuickUploadLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py

2、修改配置語言

FCKConfig.DefaultLanguage = ‘en’  改爲: FCKConfig.DefaultLanguage = ‘zh-CN’ ;//簡體中文

3、配置皮膚,有default、office2003、silver風格等。

FCKConfig.SkinPath = FCKConfig.BasePath + ’skins/default/’ ;

4、在編輯器域內可以使用Tab鍵。(1爲是,0爲否)

FCKConfig.TabSpaces = 0 ; 改爲 FCKConfig.TabSpaces = 1 ;

5、加上幾種常用的字體:

 FCKConfig.FontNames = ‘宋體;黑體;隸書;楷體_GB2312;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana’;

6、編輯器域內默認的顯示字體爲12px,想要修改可以通過修改樣式表來達到要求,打開/editor/css/fck_editorarea.css,修改font-size屬性即可

7、關於安全性

如果你的編輯器用在前臺非認證的情況下,推薦使用Basic的toolbar

FCKConfig.ToolbarSets["Basic"] = [
  ['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink','Image','-','About']

] ;

8、在上傳文件窗口點擊瀏覽服務器,可能會出現 the server didn’t send back a proper xml….. 錯誤提示,是因爲FCKeditor要求不同類型的文件分別傳到不同的目錄,包括file,image,falsh,media 等目錄,可以先建立起來試試。


FCKEditor.NET 2.6 的安全性配置

文件上傳,出錯:(This connector is disabled.please check the "editor/filemanager/connectors/aspx/config.ascx" file.)

打開 editor/filemanager/connectors/aspx/config.ascx 文件,返回true.

private bool CheckAuthentication()
{
    // WARNING : DO NOT simply return "true". By doing so, you are allowing
    // "anyone" to upload and list the files in your server. You must implement
    // some kind of session validation here. Even something very simple as...
    //
    //return ( Session[ "IsAuthorized" ] != null && (bool)Session[ "IsAuthorized" ] == true );
    //
    // ... where Session[ "IsAuthorized" ] is set to "true" as soon as the
    // user logs in your system.

    return true;
}

FCKeditor的精簡和清理

進入FCKeditor文件夾,將所有以“_”開頭的文件和文件夾刪,刪除FCKeditor文件夾下後綴名爲:.afp、.cfc、.cfm、.lasso、.pl、.py、.txt文件,只保留FCKeditor文件夾下fckconfig.js、fckeditor.js、fckstyles.xml、fcktemplates.xml就可以了;

進入editor文件夾,刪掉“_source”文件夾,裏面放的同樣是源文件;

lang裏面放的是語言包,如果只是用簡體中文,那麼只保留fcklanguagemanager.js、zh-cn.js兩個文件就OK,建議保留en.js(英文)、zh.js(繁體中文)兩個文件,fcklanguagemanager.js是語言配置文件,有了它才能和 fckconfig.js裏的設置成對,對應上相應的語言文件,一定要保留!

簡單介紹一下配置文件fckconfig.js中文註釋。如有理解錯誤的地方請高手留言指正。 

FCKConfig.CustomConfigurationsPath = '' ; //自定義配置文件路徑和名稱 

FCKConfig.EditorAreaCSS = FCKConfig.BasePath + 'css/fck_editorarea.css' ; //文本編輯區域的樣式表文件路徑

 

FCKConfig.EditorAreaStyles = '' ; //文本編輯區域的樣式表風格 
 
FCKConfig.ToolbarComboPreviewCSS = '' ; //工具欄預覽CSS 
 
FCKConfig.DocType = '' ; //文檔類型 

 

FCKConfig.BaseHref = '' ; //相對鏈接的基地址 


FCKConfig.FullPage = false ; //是否允許編輯整個HTML文件,還是僅允許編輯BODY間的內容 


FCKConfig.StartupShowBlocks = false ; //是否啓用"顯示模塊" 


FCKConfig.Debug = false ; //是否開啓調試窗口功能 


FCKConfig.AllowQueryStringDebug = true ; //是否啓用網頁查詢調試功能 


FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ; //FCKeditor皮膚路徑 


FCKConfig.SkinEditorCSS = '' ; //編輯器的皮膚CSS路徑 


FCKConfig.SkinDialogCSS = '' ; //對話窗口的皮膚CSS路徑 


FCKConfig.PreloadImages = [ FCKConfig.SkinPath + 'images/toolbar.start.gif', FCKConfig.SkinPath + 'images/toolbar.buttonarrow.gif' ] ; 

//預裝入的圖片 

FCKConfig.PluginsPath = FCKConfig.BasePath + 'plugins/' ; //插件路徑 

FCKConfig.AutoGrowMax = 400 ; //文本編輯區域允許自動增長的最大高度限制,設置此屬性時應同時將
 
// FCKConfig.Plugins.Add( 'autogrow' ) ;屬性的註釋去除,配合使用 

FCKConfig.AutoDetectLanguage = true ; //是否自動檢測語言 

FCKConfig.DefaultLanguage = 'en' ; //默認語言 

FCKConfig.ContentLangDirection = 'ltr' ; //默認的文字方向,可選"ltr/rtl",即從左到右或從右到左 

FCKConfig.ProcessHTMLEntities = true ; //處理HTML實體 

FCKConfig.IncludeLatinEntities = true ; //包括拉丁文 

FCKConfig.IncludeGreekEntities = true ; //包括希臘文 

FCKConfig.ProcessNumericEntities = false ; //處理數字實體 

FCKConfig.AdditionalNumericEntities = '' ; //附加的數字實體 

FCKConfig.FillEmptyBlocks = true ; //是否填充空塊 

FCKConfig.FormatSource = true ; //在切換到代碼視圖時是否自動格式化代碼 

FCKConfig.FormatOutput = true ; //當輸出內容時是否自動格式化代碼 

FCKConfig.FormatIndentator = ' ' ; //當在源碼格式下縮進代碼使用的字符 

FCKConfig.EMailProtection = 'none' ; //偵測電子郵件鏈接 

FCKConfig.EMailProtectionFunction = 'mt(NAME,DOMAIN,SUBJECT,BODY)' ; //偵測電子郵件鏈接 

FCKConfig.StartupFocus = false ; //開啓時焦點是否到編輯器,即打開頁面時光標是否停留在fckeditor上 

FCKConfig.ForcePasteAsPlainText = false ; //是否強制粘貼爲純文本內容 

FCKConfig.AutoDetectPasteFromWord = true ; //是否自動探測從word粘貼文件,僅支持IE 

FCKConfig.ShowDropDialog = true ; //是否顯示下拉菜單 

FCKConfig.ForceSimpleAmpersand = false ; //是否不把&符號轉換爲XML實體 

FCKConfig.TabSpaces = 0 ; //按下Tab鍵時光標跳格數,默認值爲零爲不跳格 

FCKConfig.ShowBorders = true ; //是否合併邊框 

FCKConfig.SourcePopup = false ; //是否彈出 

FCKConfig.ToolbarStartExpanded = true ; //啓動FCKeditor工具欄默認是否展開 

FCKConfig.ToolbarCanCollapse = true ; //是否允許摺疊或展開工具欄 

FCKConfig.IgnoreEmptyParagraphValue = true ; //是否忽略空的段落值 

FCKConfig.FloatingPanelsZIndex = 10000 ; //浮動面板索引 

FCKConfig.HtmlEncodeOutput = false ; //是否將HTML編碼輸出 

FCKConfig.TemplateReplaceAll = true ; //是否替換所有模板 

FCKConfig.TemplateReplaceCheckbox = true ; //是否將實際內容顯示在模版窗口中 

FCKConfig.ToolbarLocation = 'In' ; //工具欄位置 

FCKConfig.ToolbarSets["Default"] //配置默認工具欄中各按鈕,適合用於後臺編輯 

FCKConfig.ToolbarSets["Basic"] //配置基本工具欄按扭,適合前臺編輯 

FCKConfig.EnterMode = 'p' ; //編輯文本時按回車鍵自動生成<P></P>標籤 

FCKConfig.ShiftEnterMode = 'br' ; ////編輯文本時按Shift+回車鍵自動生成<br />標籤 

FCKConfig.Keystrokes //自定義鍵盤快捷鍵 

FCKConfig.ContextMenu //定義右鍵菜單的內容 

FCKConfig.BrowserContextMenuOnCtrl = false ; //是否允許在編輯區域中當按下Ctrl鍵時,點擊鼠標右鍵顯示瀏覽器的上下文菜單 

FCKConfig.BrowserContextMenu = false ; //是否允許在編輯區域中點擊鼠標右鍵顯示瀏覽器的上下文菜單 

FCKConfig.EnableMoreFontColors = true ; //是否禁止更多顏色選項 

FCKConfig.FontColors //文字顏色列表 

FCKConfig.FontFormats //文字格式列表 

FCKConfig.FontNames //字體列表 

FCKConfig.FontSizes //字號列表 

FCKConfig.StylesXmlPath = FCKConfig.EditorPath + 'fckstyles.xml' ; //CSS樣式列表的XML文件的位置 

FCKConfig.TemplatesXmlPath = FCKConfig.EditorPath + 'fcktemplates.xml' ; //模版的XML文件位置 

FCKConfig.SpellChecker = 'WSC' ; //拼寫檢查器 

FCKConfig.IeSpellDownloadUrl = 'http://www.iespell.com/download.php' ; //下載拼寫檢查器的網址 

FCKConfig.SpellerPagesServerScript = 'server-scripts/spellchecker.php' ; //拼寫檢查器腳本路徑 

FCKConfig.FirefoxSpellChecker = false ; //Firefox瀏覽器拼寫檢查 

FCKConfig.MaxUndoLevels = 15 ; //最大可以撤銷的次數 

FCKConfig.DisableObjectResizing = false ; //是否禁止用戶調整圖像和表格的大小 

FCKConfig.DisableFFTableHandles = true ; //是否禁用表格工具 

FCKConfig.LinkDlgHideTarget = false ; //是否隱藏Link窗口的target標籤 

FCKConfig.LinkDlgHideAdvanced = false ; //是否隱藏Link窗口的advanced標籤 

FCKConfig.ImageDlgHideLink = false ; //是否隱藏image窗口的link標籤 

FCKConfig.ImageDlgHideAdvanced = false ; //是否隱藏image窗口的advanced標籤 

FCKConfig.FlashDlgHideAdvanced = false ; //是否隱藏Flash窗口的advanced標籤 

FCKConfig.ProtectedTags = '' ; //添加HTML套用格式 

FCKConfig.BodyId = '' ; //設置編輯器的id 

FCKConfig.BodyClass = '' ; //設置編輯器的class 

FCKConfig.DefaultStyleLabel = '' ; //設置文本編輯器的風格,默認爲空白文檔 

FCKConfig.DefaultFontFormatLabel = '' ; //設置默認格式 

FCKConfig.DefaultFontLabel = '' ; //設置默認字體 

FCKConfig.DefaultFontSizeLabel = '' ; //設置默認字體大小 

FCKConfig.DefaultLinkTarget = '' ; //設置默認鏈接目標爲(_blank、_self _parent、_top) 

FCKConfig.CleanWordKeepsStructure = false ; //是否設置直接粘貼爲Word格式 

FCKConfig.RemoveFormatTags //刪除文字時是否刪除相應的格式 

FCKConfig.RemoveAttributes //刪除文字時是否刪除相應的樣式 

FCKConfig.CustomStyles //樣式菜單 

FCKConfig.CoreStyles //設置FCKeditor核心樣式 

FCKConfig.IndentLength = 40 ; //編輯器中縮進量的長度 

FCKConfig.IndentUnit = 'px' ; //編輯器中縮進量的單位 

FCKConfig.IndentClasses = [] ; //FCKeditor允許使用CSS縮進 

FCKConfig.JustifyClasses = [] ; //FCKeditor允許使用CSS類文本 

var _FileBrowserLanguage = 'php' ; //文件瀏覽器使用的語言 

var _QuickUploadLanguage = 'php' ; //快速上傳使用的語言 

var _FileBrowserExtension = _FileBrowserLanguage == 'perl' ? 'cgi' : _FileBrowserLanguage ; //文件瀏覽器擴展 

var _QuickUploadExtension = _QuickUploadLanguage == 'perl' ? 'cgi' : _QuickUploadLanguage ; //快速上傳擴展 

FCKConfig.LinkBrowser = true ; //是否允許在插入鏈接時瀏覽服務器 

FCKConfig.LinkBrowserURL //插入鏈接時瀏覽服務器的URL 

FCKConfig.LinkBrowserWindowWidth //鏈接目標瀏覽器窗口寬度 

FCKConfig.LinkBrowserWindowHeight //鏈接目標瀏覽器窗口高度 

FCKConfig.ImageBrowser = true ; //是否關閉圖片文件瀏覽服務器的功能 

FCKConfig.ImageBrowserURL //圖片文件瀏覽服務器的URL 

FCKConfig.ImageBrowserWindowWidth //圖像瀏覽器窗口寬度 

FCKConfig.ImageBrowserWindowHeight //圖像瀏覽器窗口高度 

FCKConfig.FlashBrowser = true ; //是否關閉Flash瀏覽服務器的功能 

FCKConfig.FlashBrowserURL //Flash瀏覽服務器的URL 

FCKConfig.FlashBrowserWindowWidth //Flash瀏覽器窗口寬度 

FCKConfig.FlashBrowserWindowHeight //Flash瀏覽器窗口高度 

FCKConfig.LinkUpload = true ; //是否開啓文件上傳的功能 

FCKConfig.LinkUploadURL //指定默認上傳文件的地址 

FCKConfig.LinkUploadAllowedExtensions //設置允許上傳文件的擴展名 

FCKConfig.LinkUploadDeniedExtensions = "" ; //設置允許上傳腳本文件的擴展名 

FCKConfig.ImageUpload = true ; //是否開啓圖片上傳功能 

FCKConfig.ImageUploadURL //指定默認上傳圖片文件的地址 

FCKConfig.ImageUploadAllowedExtensions //設置允許上傳圖片文件的擴展名 

FCKConfig.ImageUploadDeniedExtensions = "" ; //設置允許上傳圖片腳本文件的擴展名 

FCKConfig.FlashUpload = true ; //是否開啓Flash上傳功能 

FCKConfig.FlashUploadURL //Flash上傳文件的地址 

FCKConfig.FlashUploadAllowedExtensions //設置允許上傳Flash文件的擴展名 

FCKConfig.FlashUploadDeniedExtensions = "" ; //設置允許上傳Flash腳本文件的擴展名 

FCKConfig.SmileyPath //插入表情圖標的路徑 

FCKConfig.SmileyImages //表情圖標的文件名稱 

FCKConfig.SmileyColumns = 8 ; //表情窗口顯示錶情列數 

FCKConfig.SmileyWindowWidth = 320 ; //表情窗口顯示寬度,此窗口會因爲表情文件的改變而作調整 

FCKConfig.SmileyWindowHeight = 210 ; //表情窗口顯示高度,此窗口會因爲表情文件的改變而作調整 

FCKConfig.BackgroundBlockerColor = '#ffffff' ; //編輯器彈出窗口時,背景遮照住的顏色 

FCKConfig.BackgroundBlockerOpacity = 0.50 ; //編輯器彈出窗口時,背景遮照住的透明度 

FCKConfig.MsWebBrowserControlCompat = false ; 

FCKConfig.PreventSubmitHandler = false ;

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章