kentico - 如何从 Kentico.EMS12.MvcComponents.Widget.RichText 中的工具栏按钮自定义弹出窗口

Question

我最近为 Kentico.EMS12.MvcComponents.Widget.RichText 添加了 nuget 包，以利用新的基于 froala 的小部件和内联编辑器。这个版本（基于 froala 文档）是非常可定制的。不幸的是，nuget 包的实现似乎隐藏了基本的 froala 库，因此使 froala 文档的很大一部分不适用。我很好奇是否有人可以告诉我如何进行调用以自定义工具栏命令。我最初尝试时遇到的一个大问题是我无法访问基本的 froala 库，这意味着我无法进行文档中列出的调用（例如添加命令）。我查看了使用事件，但似乎仍然无法让代码在适当的上下文中运行。

Answer 1

富文本小部件的自定义是一项全新的功能，刚刚在此处记录：https ://github.com/Kentico/ems-mvc-components/wiki/Implementing-Rich-text-editor-plugins 。

Kentico 会将FroalaEditor对象作为函数参数传递到您的插件中。您的插件可以被推送到富文本插件寄存器中。看plugins.push(myButtonPlugin);

(function (pageBuilder) {
    var richTextEditor = pageBuilder.richTextEditor = pageBuilder.richTextEditor || {};
    var plugins = richTextEditor.plugins = richTextEditor.plugins || [];

    var sampleButtonPlugin = function (FroalaEditor) {
            FroalaEditor.DefineIcon("sampleButtonIcon", { NAME: "star", SVG_KEY: "help" });
            FroalaEditor.RegisterCommand("sampleButton", {
                title: "Sample Button",
                icon: "sampleButtonIcon",
                callback: function () {
                    // Use the current context to work with the content of the inline editor.
                    console.log(this.html.get());
                }
            });
        };
    plugins.push(myButtonPlugin);
})(window.kentico.pageBuilder);