如何将自定义控件添加到TinyMce 4工具栏

Question

我想介绍一个新的Control到我可以在工具栏中使用的TinyMce。在我的情况下，我想添加一个图标控件，可以放在工具栏的开头，以区分编辑器。

但是几乎没有关于如何正确执行此操作的信息。

Answer 1

最后，我设法想出了一个方法来正确地做到这一点。

首先我介绍一个新的插件icon（在icon/plugin.js），其登记一个新的控制Icon。它使用设置iconClass。

tinymce.PluginManager.add('icon', function() { 
    tinymce.ui.Icon = tinymce.ui.Widget.extend({ 
     renderHtml: function() { 
      return '<span class="icon icon-' + this.settings.iconClass + '"> </span>'; 
     } 
    }); 
}); 

接下来我添加了一个按钮facebook到工具栏的方式如下：

editor.addButton('facebook', { 
    type: 'icon', 
    iconClass: 'facebook-share' 
}); 

现在，我可以把它添加到工具栏规格：

tinymce.init({ 
    toolbar: "facebook" 
}) 

这就是它！新的自定义控件不应该呈现。插件代码只运行一次;即使多次使用。