PHP 整合 FCKeditor (CKEditor) 完整安裝配置與圖片上傳指南

前言

FCKeditor（現更名為 CKEditor）是經典的線上富文本編輯器，支援 PHP、.NET、Java 等多平台。本文以 2.6.6 版為例，說明在 PHP 專案中安裝、配置工具列與啟用圖片上傳的完整步驟。

安裝步驟

1. 下載原始碼包（.zip 或 .tar.gz），解壓縮。
2. 將解壓後的 fckeditor 資料夾複製至專案目錄（如網站根目錄）。

基本使用範例 (Index.php)

<?php require_once 'editor/fckeditor.php'; ?>
<!DOCTYPE html>
<html>
<head>
    <meta charset="gbk">
    <title>編輯器測試</title>
</head>
<body>
<form action="do.php" method="post" enctype="multipart/form-data">
    <div class="reviewFace">
        <!-- 表情選擇略 -->
    </div>
    <div class="reviewFace">
    <?php
    $FCKeditor = new FCKeditor('cContent');
    $FCKeditor->Width = '100%';
    $FCKeditor->Height = '350';
    $FCKeditor->BasePath = 'editor/';
    $FCKeditor->ToolbarSet = 'Default'; // 或 'Basic'
    echo $FCKeditor->CreateHtml();
    ?>
    </div>
    <input type="submit" value="提交">
</form>
</body>
</html>

工具列配置

• Default：完整功能，適合後台管理。
• Basic：基礎功能，適合前台使用者。
• 切換方式：$FCKeditor->ToolbarSet = 'Basic';

自訂工具列（修改 fckeditor.js）

在 fckeditor.js 中尋找 FCKConfig.ToolbarSets，可新增自訂組合：

FCKConfig.ToolbarSets["Leapsoulcn"] = [
    ['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink']
];

使用時設定 $FCKeditor->ToolbarSet = 'Leapsoulcn';。

啟用圖片上傳（關鍵配置）

1. 編輯 editor/filemanager/connectors/php/config.php：

$Config['Enabled'] = true; // 必須設為 true
$Config['UserFilesPath'] = '/UserFiles/'; // URL 路徑
$Config['UserFilesAbsolutePath'] = '/var/www/html/UserFiles/'; // 絕對實體路徑，需可寫入

2. 確保 UserFiles 目錄存在且 PHP 執行身分具寫入權限（chmod 777 或適當 ACL）。
3. 上傳檔案類型限制在同檔案的 $Config['AllowedExtensions'] 陣列設定。

常見問題排查

• 上傳失敗：檢查 config.php 路徑設定、目錄權限、PHP upload_max_filesize / post_max_size 限制。
• 圖片顯示不出：確認 UserFilesPath 對應的 URL 可正常存取。
• 編輯器未載入：檢查 BasePath 是否正確指向 editor/ 目錄。

結語

FCKeditor/CKEditor 整合 PHP 專案只需三步：複製目錄、實例化配置、啟用連接器上傳。掌握工具列切換與自訂，即可依據前後台需求提供最適編輯體驗。若為新專案，建議直接採用最新版 CKEditor 4/5，架構更現代、套件生態更豐富。