TinyMCE 4 Add-Drop-Down-Menü Menüleiste

Question

Ich brauche noch einen Drop-Down-Menü neben "Tools" in TinyMCE 4 hinzuzufügen: diese

Die nächste Lösung, die ich gefunden war:

// Adds a custom menu item to the editor that inserts contents when clicked 
// The context option allows you to add the menu item to an existing default menu 
tinymce.init({ 
    ... 

    setup: function(ed) { 
     ed.addMenuItem('example', { 
     text: 'My menu item', 
     context: 'tools', 
     onclick: function() { 
      ed.insertContent('Hello world!!'); 
     } 
     }); 
    } 
}); 

Es wird jedoch nur ein Element zum bereits vorhandenen Menü "Extras" hinzugefügt.

Answer 1

Sie versuchen, beide geben ‚Menü‘ und ‚menubar sehen können 'Option, wenn Sie tinymce.init() aufrufen, um ein neues Menüelement zum modernen Thema hinzuzufügen.

Ich habe es versucht und es funktioniert.

Sie können die Live-Demo auf http://fiddle.tinymce.com/39eaab/1 mit TinyMCE 4.1.7 überprüfen.

<script type="text/javascript"> 
tinymce.init({ 
    selector: "textarea", 
    menu : { 
     file : {title : 'File' , items : 'newdocument'}, 
     edit : {title : 'Edit' , items : 'undo redo | cut copy paste pastetext | selectall'}, 
     insert : {title : 'Insert', items : 'link media | template hr'}, 
     view : {title : 'View' , items : 'visualaid'}, 
     format : {title : 'Format', items : 'bold italic underline strikethrough superscript subscript | formats | removeformat'}, 
     table : {title : 'Table' , items : 'inserttable tableprops deletetable | cell row column'}, 
     tools : {title : 'Tools' , items : 'spellchecker code'}, 
     newmenu: {title : 'New Menu', items : 'newmenuitem'} 
    }, 
    menubar: 'file edit newmenu', 
    setup: function(editor) { 
     editor.addMenuItem('newmenuitem', { 
      text: 'New Menu Item', 
      context: 'newmenu', 
      onclick: function() { alert('yey!'); } 
     }); 
    } 
}); 
</script> 

<form method="post" action="dump.php"> 
    <textarea name="content"></textarea> 
</form> 

Answer 2

Nicht sicher ist es, was Sie brauchen, aber was ist, wenn Sie versuchen, diese:

<script type="text/javascript"> 
tinymce.init({ 
    selector: "textarea", 
    toolbar: "mybutton", 
    setup: function(editor) { 
     editor.addButton('mybutton', { 
      type: 'menubutton', 
      text: 'My button', 
      icon: false, 
      menu: [ 
       {text: 'Menu item 1', onclick: function() {editor.insertContent('Menu item 1');}}, 
       {text: 'Menu item 2', onclick: function() {editor.insertContent('Menu item 2');}} 
      ] 
     }); 
    } 
}); 
</script> 

Sie können das Ergebnis des Codes here