TinyMCE自定义“文件”菜单栏

Question

有没有办法在TinyMCE 4.0中自定义（添加和删除选项，e.t.c ..）菜单栏？我无法找到有关编辑器特定部分的任何文档。下面的图片展示了我正在谈论的部分。

Answer 1

版本4是重大改写，文档暂时不同步。

通过实验，我发现可以单独启用/禁用下拉菜单或禁用整个菜单栏。

仅启用特定下拉菜单：

tinymce.init({
    selector: "textarea",
    menubar: "edit format"
});

禁用菜单栏：

tinymce.init({
    selector: "textarea",
    menubar: false
});

menubar configuration docs现已添加到TinyMCE网站。

此外，如果您想完全自定义整个菜单，请查看menu configuration docs。

Answer 2

我最后通过调整传递给menu的设置对象中的toolbar和tinymce.init()属性来自定义菜单栏和工具栏：

// ...
  menu : {
    edit: { title: 'Edit', items: 'undo redo  | cut copy paste selectall | searchreplace' },
    insert: { title: 'Insert', items: 'link charmap' },
    format: { title: 'Format', items: 'bold italic underline strikethrough superscript subscript | removeformat' },
    table: { title: 'Table', items: 'inserttable tableprops deletetable | cell row column' }
  },
  toolbar: 'undo redo | bold italic underline | link hr | alignleft aligncenter alignright | blockquote bullist numlist outdent indent | code',
// ...

我通过在源代码中挖掘寻找.addMenuItem(和.addButton(来找到每个菜单/按钮的术语。

Answer 3

在 TinyMCE 4.x 版本中，“code”插件用于显示/编辑编辑器内容的HTML代码。

要control工具栏，最多4.0.6版本，使用theme_advanced_button<1-n>选项，但4.0.6以上版本， toolbar 或{{使用了3}}选项。

通过在工具栏选项中添加“code”插件，“工具”菜单将添加“源代码”子菜单（如按钮“<>”（图标））。

tinyMCE.init({
    // ......
    // ......
    plugins: "searchreplace code",

    toolbar1: "separator forecolor backcolor code",
    toolbar2: "<<<some buttons list>>>",
    toolbar3: "<<<some buttons list>>>",
    toolbar4: "<<<some buttons list>>>",
});