CKEditor的，如何調整包裝代碼顯示的造型

Question

我測試了CKEditor

我試圖讓顯示在編輯器中，以配合我的網站的CSS樣式顯示最終結果。

我想要做的是風格的「包裝代碼」按鈕來匹配我的網站的CSS，通過添加在類中。

我已經看到了this page of the manual，你可以做這樣的東西：

config.format_pre = { element: 'pre', attributes: { 'class': 'editorCode' } }; 

然而，做同樣的代碼塊，像這樣：

config.format_code = { element: 'code', attributes: { 'class': 'someclass' } }; 

實際上並沒有做任何東西。任何人都有一個指示我可能會失蹤？

我測試過它在其他元素上工作，所以我知道配置文件更改正在拾取。

Answer 1

重要的是，通過config.format_tagname格式化的每個標籤也應包含在config.format_tags中。但是，這兩個設置（config.format_tagname和config.format_tags）僅適用於塊級元素（如所引用的manual page中所述）。

由於code元素被CKEditor視爲內聯元素（請參閱DTD），因此無法在此處使用此配置。

但是，修改通過樣式下拉菜單添加的元素的最簡單方法是編輯存在於CKEditor目錄中的styles.js文件。下拉式樣基於此文件，因此您可以輕鬆修改code element there。您也可以定義您的自定義stylesSet。