前言：
　　FCKeidtor是個國外的多語言編輯器，你可以對其配置文件進行簡單修改使之支持目前常用Web開發(fā)語言的應(yīng)用，下面我就講講FCKeditor的最新版本2.4.2在php的具體配置過程，有不足和出錯的地方，歡迎指正。

精簡：
　　正因為這個編輯器是支持多語言的，所以首先我們針對使用對其做相應(yīng)的冗余文件刪除。
　　
　　1、臨時文件及文件夾刪除：從根目錄下開始刪除一切以“_”開頭的文件及文件夾，因為他們?yōu)榕R時文件和文件夾。刪除這類臨時文件及文件夾之后，我們還要刪除一些根目錄下的多余文件，根目錄下我們只保留fckconfig.js（配置文件）、fckeditor.js（js方式調(diào)用文件）、fckeditor.php（php方式調(diào)用文件，新版本通過該文件統(tǒng)一調(diào)用php4或者php5的調(diào)用文件，fckeditor_php4.php/fckeditor_php5.php你可以根據(jù)自己服務(wù)器使用的情況刪減，建議都保留）、fckeditor_php4.php（php4的調(diào)用文件）、fckeditor_php5.php（php5的調(diào)用文件）、fckstyles.xml（樣式）、fcktemplates.xml（模板）文件和editor文件夾。
　　
　　2、editor\lang目錄：存放的是多語言配置文件，因為我們只可能用到en和zh-cn（簡體中文）所以，根據(jù)我的選擇，我刪掉其他的語言配置文件。

　　3、editor\skins界面目錄：默認帶有三個界面（default：默認界面，加載速度相對較快；office2003：相對pp的界面，不過速度確實要慢些；silver：銀白色界面，加載速度也相對較快），可以自行決定是否刪除其中一兩個。

　　4、editor\filemanager\browser\default\connectors目錄：存放編輯器所支持的Web動態(tài)語言，我們以php為例所以保留php目錄，test.html文件可以幫助你查看某語言下的上傳設(shè)置等（具體上傳設(shè)置我將在后面的配置作較為詳細講解），可以自行決定是否刪除。

　　5、editor\filemanager\upload目錄：同理。

　　到此精簡完成，你會發(fā)現(xiàn)整個編輯器確實“瘦身”不少，呵呵 基本配置：

　　下面我開始對編輯器進行簡單配置（并非每步都必須，可根據(jù)自己的需要參考修改）：

　　1、默認語言
　　打開fckconfig.js文件（注意此文件是utf-8編碼哦），找到FCKConfig.AutoDetectLanguage = true ;（第56行）此句作用為自動檢測語言，默認為true，即表示編輯器會根據(jù)系統(tǒng)語言自動檢測加載相應(yīng)的語言，我們將其改為false，不讓其檢測，然后將FCKConfig.DefaultLanguage = 'en';（編輯器默認語言，第57行）改為簡體中文"zh-cn"。

　　2、字體列表
　　依然打開fckconfig.js，因為此編輯器為外國人編寫，所以默認不提供中文字體，我們?yōu)槠浼尤?#xff0c;找到FCKConfig.FontNames（第142行）加入“宋體;楷體_GB2312;新宋體;黑體;隸書;幼圓;”其他字體可根據(jù)自己需要自行加入。

　　3、文件上傳
　　FCKeditor的文件管理程序在editor/filemanager/文件夾下，分為瀏覽（browser）和上傳（upload）兩種?！盀g覽”是指瀏覽服務(wù)器已存在文件并可以選擇，也可以上傳本地文件至服務(wù)器；上傳是指快速上傳，在窗口中點“上傳”選項，選擇本地文件后上傳就行，但是不能查看服務(wù)器上已有上傳文件，相對而言不太方便，只是操作更為快捷。也就是說FCKeditor中有一個文件瀏覽，有兩個文件上傳，而這些設(shè)置是分散在多個文件中，配置相對復(fù)雜，下面我大致講一下：
　　在FCKeditor中共有三個文件跟上傳功能有關(guān)，一個是js文件，兩個是php文件，前者關(guān)閉后界面中不出現(xiàn)相關(guān)窗口或按鈕，后者關(guān)閉后相關(guān)功能不可用。
　　js文件即是指的fckconfig.js文件，在以前舊版本的fckconfig.js中首先你必需開啟如下幾項： 瀏覽上傳功能：
FCKConfig.LinkBrowser = true ; //文件
FCKConfig.ImageBrowser = true ; //圖片
FCKConfig.FlashBrowser = true ; //Flash


　　快速上傳功能：
FCKConfig.LinkUpload = true ; //同上
FCKConfig.ImageUpload = true ; //同上
FCKConfig.FlashUpload = true ; //同上

　　即把這幾項設(shè)為true，而我們今天使用的2.4.2的fckconfig.js中默認已經(jīng)是開啟上傳開關(guān)顯示功能的，所以，如果你要將該編輯器作為前臺使用（fckeditor上傳漏洞問題一直沒有得到較好的改善），考慮到安全性你可能需要關(guān)閉文件上傳功能，那么你只需要將這幾項設(shè)置為false即可（當然兩個php文件你也不要開啟上傳功能哦）。

　　如果你要使用文件上傳功能，那么我們繼續(xù)配置：
　　依然在fckconfig.js文件中，fckeditor對語言默認支持的是asp，找到以下兩句，進行相應(yīng)修改：
　　

var _FileBrowserLanguage = 'asp' ; // asp | aspx | cfm | lasso | perl | php | py（第182行）
var _QuickUploadLanguage = 'asp' ; // asp | aspx | cfm | lasso | php（第183行）


　　我們將其均改為'php':
var _FileBrowserLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | py（第182行）
var _QuickUploadLanguage = 'php' ; // asp | aspx | cfm | lasso | php

　　在2.4.2版本中，我們發(fā)現(xiàn)增加了對更多文件后綴名的支持，這個應(yīng)該是為了解決上傳漏洞所作的些許改動，不過作用不大，呵呵
　　*.AllowedExtensions：（其中*號代表：FCKConfig.LinkUpload、FCKConfig.ImageUpload等）表示允許上傳的文件后綴名，為空表示允許所有文件，你可根據(jù)自己需要設(shè)置上傳文件后綴名，一定程度增加安全性，設(shè)置的格式可以參考它已有的后綴名設(shè)置。
　　*.DeniedExtensions：同上，表示禁止上傳的文件后綴名。

　　注：你設(shè)置了允許上傳的，當然禁止的也就不必要設(shè)置了，本人推薦設(shè)置允許的，畢竟禁止的后綴名列表不能羅列完全，可能還有很多我們不曾想到的后綴名。

　　對js文件的配置到此已經(jīng)完成，下面我們進行兩個php文件在上傳方面的設(shè)置：

　　文件瀏覽上傳修改：
　　打開editor\filemanager\browser\default\connectors\php\config.php文件，找到：
　　$Config['Enabled'] = false ;（第28行）將false改為true，即允許上傳。
　　$Config['UserFilesPath'] = '/userfiles/' ;（第32行）為定義上傳目錄，可根據(jù)自己情況進行修改，我將其改為upload目錄。

　　注：注意FCKeditor是不支持虛擬目錄的，你的所有路徑都是針對網(wǎng)站根目錄的絕對路徑。

　　文件快速上傳修改：
　　打開文件editor\filemanager\upload\php\config.php文件，找到
　　$Config['Enabled'] = false ;（第28行）將false改為true。
　　$Config['UserFilesPath'] = '/UserFiles/' ;（第35行）同“文件瀏覽上傳”的上傳目錄。
　　$Config['UseFileType'] = false ; （第32行）改為true，不然上傳文件不會放在上傳目錄中
　　在該文件中，還有一項：
　　$Config['UserFilesAbsolutePath'] = '' ;（第41行）
　　這項的作用是設(shè)定上傳的絕對路徑，比如，你想指定上傳文件到D:/Web/upload/下，你可以指定它的值為你的絕對路徑，注意，如果你指定了該值，那你也要對$Config['UserFilesPath'] = '/UserFiles/' ;作相同的設(shè)置。

　　到此上傳基本配置已經(jīng)完成，整個編輯器最基本的配置也已經(jīng)結(jié)束了，你可以通過下列代碼對其進行調(diào)用測試了：
　　<?php
　　include("/fckeditor/fckeditor.php"); // 包含fckeditor類，fckeditor目錄放在網(wǎng)站根目錄下
　　$BasePath = "/fckeditor/"; // 編輯器路徑
　　$oFCKeditor = new FCKeditor('jayliao'); // 創(chuàng)建一個fckeditor對象，表單的名稱為jayliao
　　$oFCKeditor->BasePath = $BasePath;
　　$oFCKeditor->Value = 'test'; // 設(shè)置表單初始值
　　
　　// 還可設(shè)置以下部分（“=”包含部分），并非必須：
　　//==================================================================================//
　　$oFCKeditor->Width = '100%'; // 編輯器寬度，類中有默認值，如果不想修改可不管此項
　　$oFCKeditor->Height= '300'; // 同width，此處為高$oFCKeditor->ToolbarSet
　　$oFCKeditor->ToolbarSet = 'JayLiao'; // 默認編輯器工具欄有Basic（基本工具）和Default（所有工具）兩種選擇，JayLiao為本人自定義的工具條，如有需要可參考后文中的說明新建或修改工具條
　　$oFCKeditor->Config['SkinPath'] = '/fckeditor/editor/skins/office2003/'; // 設(shè)置編輯器皮膚
　　//==================================================================================//
　　
　　$oFCKeditor->Create(); // 調(diào)用類中方法，必須
　　?>

趕緊測試一下吧，是不是很激動，終于可以看到這個強大的編輯器了，呵呵。不過，馬上你會發(fā)現(xiàn)在上傳以中文命名的文件時會出現(xiàn)亂碼，這到底是怎么回事呢？呵呵，不怕，下面我們就對其進行簡單修改問題很快就解決的：
　　我們?yōu)樯蟼魑募詴r間+隨機數(shù)作為其新名字，打開：editor\filemanager\upload\php\upload.php，找到：
　　$sFileName = $oFile['name'] ;
　　替換為：
　　$sFileName = $oFile['name'] ;
　　$sOriginalFileName = $sFileName ;
　　$sExtension = substr( $sFileName, ( strrpos($sFileName, '.') + 1 ) ) ;
　　$sExtension = strtolower( $sExtension ) ;
　　$sFileName = date("YmdHis").rand(100, 200).".".$sExtension;
　　哈哈，你會發(fā)現(xiàn)“快速上傳”的亂碼已經(jīng)解決，就這么簡單，高興之余不要忘了，同樣，還需要修改“瀏覽”的上傳，修改文件：editor\filemanager\browser\default\connectors\php\commands.php，修改內(nèi)容同上。

　　另：你上傳的中文文件不做以上命名修改可能在服務(wù)器上并非亂碼，如果你只是為了在瀏覽的時候讓編輯器正確顯示該類文件名，那你可以作如下修改，打開：editor\filemanager\browser\default\connectors\php\util.php，修改ConvertToXmlAttribute函數(shù)，將：

return utf8_encode( htmlspecialchars( $value ) ) ;

　　修改為：

return iconv( "GBK", "UTF-8", htmlspecialchars($value) ) ;

　　這樣，你的編輯器應(yīng)該已經(jīng)能正確顯示中文名，不過強烈建議你修改上傳文件的命名，中文名可能存在諸多不便。

　　當完成以上設(shè)置后，fckeditor已經(jīng)能滿足我們的日常使用需要，不過我們卻又發(fā)現(xiàn)一個問題，那就是上傳后的文件我們卻無法刪除，這樣會使網(wǎng)站上的垃圾文件（主要是圖片）日益增多，那我們是否能夠通過對編輯器的修改能較為方便的管理刪除無用上傳文件呢？我們不難想到fckeditor的瀏覽文件功能，對該功能進行適當?shù)臄U展，對日常所上傳的文件進行管理就變得相當簡單易行了，那我們趕緊動手吧：
　　增加該功能我們修改的頁面為：fckeditor\editor\filemanager\browser\default\frmresourceslist.html

　　第一步，在頁面的body區(qū)域增加如下代碼：
　　

　　<div id="showFile" style="float:left; display:none; background-color:#999999"></div>
　　<iframe id="iframe_del" name="iframe_del" width="0" height="0" scrolling="no"></iframe>
　　<div id="body_content"></div>


　　說明：第一對
的作用是當我們把鼠標移動到所上傳的文件上時顯示其相關(guān)信息；<iframe></iframe>標簽的作用是供我們刪除上傳文件時做動作響應(yīng)窗口的，即是將我們的刪除動作在iframe中運行，目的是實現(xiàn)偽無刷新刪除效果；最后一對
的作用是顯示上傳文件及文件夾的列表（2.4較以前版本對標簽中內(nèi)容作了調(diào)整，老版該頁面以作為存放列表的容器，而新版直接將顯示容器在js中生成，為了使文件顯示div和iframe兩組標簽正常使用，故在body標簽中加入一對
標簽，使之能正常使用，在我的嘗試中，倘若不這樣修改似乎有錯，當然不排除我方法不當?shù)脑?#xff0c;呵呵）
　　
　　第二步，在文件的js代碼區(qū)中加入：
　　

// add by jayliaoscu @ 2007-04-23 /*{{{{*/
　　// 顯示文件顯示層
　　function showDiv( fileUrl )
　　{
　　　　var name = fileUrl;
　　　　//獲取文件類型
　　　　var suffix = name.substring(name.lastIndexOf(".")+1);

　　　　var div= document.getElementById("showFile");
　　　　div.content = "";
　　　　div.style.position = "absolute";
　　　　div.content += "<table width='256' border='0' cellpadding='3' cellspacing='1' bgcolor='#737357'><tbody><tr><td height='23' align='left' bgcolor='#C7C78F'><table width='100%' height='100%' border='0' cellpadding='0' cellspacing='0'><tbody><tr><td width='47%'>?<a href='javascript:' onClick='hiddenDiv();'><font color='#000000' style='text-decoration:none;'>關(guān)閉</font></a></td><td width='53%' align='right'><a href='javascript:' + fileUrl + "\");'><font color='#000000' style='text-decoration:none;'>刪除</font></a>?</td></tr></tbody></table></td></tr>";
　　　　if (suffix=='gif' || suffix=="jpg" || suffix=="jpeg" || suffix=="bmp" || suffix=="png")
　　　　{
　　　　　　　div.content += "<tr><td align='center' bgcolor='#C7C78F'><img src='" + fileUrl + "' οnlοad='if(this.width>250) this.width=250' style='margin:3px;'></td></tr>";
　　　　}
　　　　else
　　　　{
　　　　　　　div.content += "<tr><td height='35' align='center' bgcolor='#C7C78F'><strong>該類型不能預(yù)覽</strong></td></tr>";
　　　　}
　　　　div.content += "</tbody></table>";
　　　　div.innerHTML = div.content;
　　　　div.style.display = "";
　　　　div.style.top = event.y+document.body.scrollTop+10;
　　　　div.style.left = event.x+document.body.scrollLeft+30;
　　}
　　// 隱藏文件顯示層
　　function hiddenDiv()
　　{
　　　　var div= document.getElementById("showFile");
　　　　div.style.display ="none";
　　}
　　// 在iframe中刪除文件
　　function delFile( fileUrl )
　　{
　　　　if(!confirm('你確定刪除該文件？'))
　　　　return;
　　　　var url = '/fckeditor/del_file.php?filePath='+ fileUrl;
　　　　window.open(url, "iframe_del");
　　　　Refresh();
　　}
　　///*}}}*/


第三步，修改本頁面原有js
　　修改：
　　

　　oListManager.Clear = function()
　　{
　　　　document.body.innerHTML = '' ;
　　}


　　為：
　　

　　oListManager.Clear = function()
　　{
　　　　hiddenDiv();
　　　　document.getElementById("body_content").innerHTML = '' ; // body_content為我們在body區(qū)域增加的div標簽
　　}


　　
　　找到：
　　

var sLink = '<a href="#" + fileUrl.replace( /'/g, '\\\'') + '\');return false;">' ;

　　修改為：

var sLink = '<a href="#" + fileUrl + '\');" + fileUrl.replace( /'/g, '\\\'') + '\');return false;">' ; // 即是文件信息顯示功能


　　修改：
　　

　　function Refresh()
　　{
　　　　LoadResources( oConnector.ResourceType, oConnector.CurrentFolder ) ;
　　}


　　為：
　　

　　function Refresh()
　　{
　　　　hiddenDiv(); // 所作修改，為了刷新列表時默認隱藏文件顯示層
　　　　LoadResources( oConnector.ResourceType, oConnector.CurrentFolder ) ;
　　}


　　修改函數(shù)：GetFoldersAndFilesCallBack，找到：
　　

document.body.innerHTML = oHtml.ToString() ;


　　修改為：
　　

document.getElementById("body_content").innerHTML = oHtml.ToString() ;


　　最后，增加一個文件刪除頁面del_file.php（該文件路徑和增加的js函數(shù)delFile(fileUrl)中的調(diào)用一致），作用為刪除文件，給出成功與否的操作提示，參考代碼：
　　<?php
　　$filePath = "..".trim($_GET['filePath']);

　　if ( $filePath )
　　{
　　　　@unlink($filePath);
　　　　echo "<script>alert('刪除成功。');</script>";
　　}
　　else
　　{
　　　　echo "<script>alert('刪除錯誤，可能文件不存在或者已經(jīng)刪除。');</script>";
　　}
　　?>]

　　至此，我對于fckeditor的修改基本完成，當然這些修改只是對fckeditor修改使用的拋磚引玉，給大家一個參考，希望對初學(xué)者有所幫助。后面對編輯器的修改過程比較匆忙，并未修改一步完成一步文檔書寫，所以，難免有所出錯，望見諒，如果你有什么問題和錯誤發(fā)現(xiàn)歡迎聯(lián)系我互相討論，共同進步，呵呵。

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　By jayliaoscu @ 2007-5-5
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　QQ: 41806572
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　Email: [email]jayliaoscu@gmail.com[/email]

另附：
配置文件（fckconfig.js）中主要配置項目如下，根據(jù)自己看情況配置：

CODE:　FCKConfig.CustomConfigurationsPath = '' ; // 自定義配置文件路徑和名稱
FCKConfig.EditorAreaCSS = FCKConfig.BasePath + 'css/fck_editorarea.css'; // 編輯區(qū)的樣式表文件
FCKConfig.BaseHref = ''; // 相對鏈接的基地址
FCKConfig.Debug = true/false; // 是否開啟調(diào)試功能，當調(diào)用FCKDebug.Output()時，會在調(diào)試窗中輸出內(nèi)容
FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/'; // 設(shè)置皮膚
FCKConfig.AutoDetectLanguage = true/false ; // 是否自動檢測語言
FCKConfig.DefaultLanguage = 'zh-cn' ; // 設(shè)置默認語言
FCKConfig.ContentLangDirection = 'ltr/rtr'; // 默認文字方向，ltr左，rtr右
FCKConfig.FillEmptyBlocks = true/false ; // 使用這個功能，可以將空的塊級元素用空格來替代
FCKConfig.FormatSource = true/false; // 切換到代碼視圖時，是否自動格式化代碼
FCKConfig.FormatOutput = true/false; // 當輸出內(nèi)容時是否自動格式化代碼
FCKConfig.FormatIndentator = ""; // 當在“源碼格式”下縮進代碼使用的字符
FCKConfig.GeckoUseSPAN = true/false; // 是否允許SPAN標記代替B，I，U標記
FCKConfig.StartupFocus = true/false; // 開啟時是否FOCUS到編輯器
FCKConfig.ForcePasteAsPlainText = true/false;// 強制粘貼為純文本
FCKConfig.ForceSimpleAmpersand = true/false; // 是否不把&符號轉(zhuǎn)換為XML實體
FCKConfig.TabSpaces = 0/1; // TAB是否有效
FCKConfig.TabSpaces = 4; // TAB鍵產(chǎn)生的空格字符數(shù)
FCKConfig.ShowBorders = true/false; // 是否合并邊框
FCKConfig.ToolbarStartExpanded = true/false; // 頁面載入時，工具欄是否展開，點“展開工具欄”時才出現(xiàn)
FCKConfig.ToolBarCanCollapse = true/false; // 是否允許展開折疊工具欄
FCKConfig.ToolbarSets = object ; // 編輯器的工具欄，可以自行定義，刪減，可參考已存在工具欄
FCKConfig.EnterMode = 'p'; // 編輯器中直接回車，在代碼中生成，可選為p | div | br
FCKConfig.ShiftEnterMode = 'br'; // 編輯器中Shift+回車，在代碼中生成，可選為p | div | br
FCKConfig.ContextMenu = 字符串數(shù)組; // 右鍵菜單的內(nèi)容
FCKConfig.FontColors = ""; // 文字顏色列表
FCKConfig.FontNames = ""; // 字體列表
FCKConfig.FontSizes = ""; // 字號列表
FCKConfig.FontFormats = ""; // 文字格式列表
FCKConfig.StylesXmlPath = ""; // CSS樣式列表的XML文件的位置
FCKConfig.TemplatesXmlPath = ""; // 模版的XML文件位置
FCKConfig.SpellChecker = "ieSpell/Spellerpages"; // 拼寫檢查器
FCKConfig.IeSpellDownloadUrl = ""; // 下載拼寫檢查器的網(wǎng)址
FCKConfig.SmileyPath = FCKConfig.BasePath + 'p_w_picpaths/smiley/msn/'; // 表情文件存放路徑
FCKConfig.SmileyImages = ''; // 表情文件名稱列表，具體參考默認設(shè)置
FCKConfig.SmileyColumns = 8; // 表情窗口顯示表情列數(shù)
FCKConfig.SmileyWindowWidth = 320; // 表情窗口顯示寬度，此窗口會因為表情文件的改變而作調(diào)整
FCKConfig.SmileyWindowHeight = 240; // 表情窗口顯示高度，此窗口會因為表情文件的改變而作調(diào)整
FCKConfig.FullPage = true/false; // 是否允許編輯整個HTML文件，還是僅允許編輯BODY間的內(nèi)容

轉(zhuǎn)載于:https://blog.51cto.com/xieyu/40349

總結(jié)

以上是生活随笔為你收集整理的FckEditor配置详解的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。