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

Question

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

Answer 1

Rich文本窗口小部件的定制是一项崭新的功能，在此处刚刚进行了记录：https://github.com/Kentico/ems-mvc-components/wiki/Implementing-Rich-text-editor-plugins。

Kentico会将FroalaEditor对象作为函数参数传递给您的插件。您的插件可以被推送到RTF插件注册中。参见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);