JavaScript 활용팁
HOME > WEB > JavaScript 활용팁
2017.03.22 / 21:24

Remove menu and status bars in TinyMCE 4

스텔라
추천 수 210

Remove menu and status bars in TinyMCE 4


I am trying to remove the menu and status bars from TinyMCE 4 because I want to setup a very basic editor. Is this possible?

The documentation for TinyMCE 3 does not seem to be relevant and I cannot find anything for version 4.



I looked at the source and it was fairly obvious:

tinyMCE.init({
    menubar:false,
    statusbar: false,
        //etc
})

This removes both.

You can also customise what parts of the default menu bar are visible by specifying a string of enabled menus - e.g. menubar: 'file edit'

You can define your own menus like this:

menu : {    
    test: {title: 'Test Menu', items: 'newdocument'} 
},
menubar: 'test'

TinyMCE customize “file” menubar



Is there a way to customize (add and remove options, e.t.c..) the menubar in TinyMCE 4.0? I am unable to find any documentation on that specific part of the editor. The image below demonstrates the part I'm talking about. enter image description here

Version 4 is a major rewrite and the docs were out of sync for a while.

Through experimentation, I discovered that it is possible to enable/disable the drop-downs individually or disable the whole menubar.

Enable specific drop downs only:

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

Disable menubar:

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

The menubar configuration docs have now been added to TinyMCE site.

Also, if you want to completely customize the whole menu, check out the menu configuration docs.