如何在 Magnolia CMS 中为 CKEditor 添加外部插件?
Posted
技术标签:
【中文标题】如何在 Magnolia CMS 中为 CKEditor 添加外部插件?【英文标题】:How to add external plug in for CKEditor in Magnolia CMS? 【发布时间】:2015-09-07 14:30:04 【问题描述】:我正在尝试在 Magnolia CMS 5.3 中自定义我的 CKEditor。为此,我想在我的 CKEditor 中添加字体、颜色按钮。
我尝试了一种方法,我下载了这些插件并将这些 plugin.js 文件放在我的 STK->资源中,我在 FCKconfig.js 文件中添加了以下代码
load external plugin
(function()
CKEDITOR.plugins.addExternal('font','ckeditor/', 'font-plugin.js');
CKEDITOR.plugins.addExternal('font','ckeditor/', 'color-plugin.js');
)();
还有,
config.extraPlugins = 'font';
config.extraPlugins = 'colorbutton';
但我得到的是默认的 CKEditor 而不是自定义的。
错误:图像、超链接不起作用。
你能推荐我吗?
【问题讨论】:
【参考方案1】:在对话框的 JCR 或 YAML 中的字段定义中,您可以使用 configJsFile 标记指向配置 .js 文件,例如:
form:
tabs:
- name: tabText
label: Text
fields:
- name: text
fieldType: richText
tables: true
configJSsFile: 'path_to_File'
height: 500
label: Text Editor
在该文件中,您可以更改配置并添加插件,如下所示:
CKEDITOR.plugins.addExternal("plugin_name", CKEDITOR.vaadinDirUrl + "js/plugin_folder/");
CKEDITOR.editorConfig = function( config )
// MIRROR info.magnolia.ui.form.field.definition.RichTextFieldDefinition
definition =
alignment: false,
images: true,
lists: true,
source: true,
tables: true,
colors: null,
fonts: null,
fontSizes: null
...
...
您可以查看 Magnolia 上的 this 文档以获取更多信息,并查看此第三方教程 tutorial 添加 codemirror 插件。
【讨论】:
【参考方案2】:您可能想阅读 Magnolia 文档,了解如何自定义 Magnolia 随附的 ckEditor。 https://documentation.magnolia-cms.com/display/DOCS53/Rich+text
您需要做的是在您的自定义配置中重新添加 magnolialink
和 magnoliaFileBrowser
插件......也许还有其他一些事情。
【讨论】:
谢谢 Jan。我做了同样的事情,我得到了除字体和颜色之外的所有工具。你能推荐我吗? 如果您在使用自己的配置文件时想要与 Magnolia 使用的颜色和字体相同,则需要将它们从 Magnolia 的配置复制到您的配置中。以上是关于如何在 Magnolia CMS 中为 CKEditor 添加外部插件?的主要内容,如果未能解决你的问题,请参考以下文章