CODEWITHSUNDEEP
javascripthtmltinymcerich-text-editorrichtext
sjahan
sjahan

Reputation: 5950

TinyMCE tables: how to hide advanced properties?

I'm using TinyMCE in the current last version (5.0.14) with the table plugin and i'm trying to remove from the menu the more advanced features of the table plugin:

The following properties are documented: 

table_advtab: false,
table_row_advtab: false,
table_cell_advtab: false

although, they have no effect.

Here is a fiddle showing the issue: https://jsfiddle.net/o2e8nhyb/1/ (sorry about not using the SO snippet, something goes wrong with TinyMCE loading additional resources...)

Does anyone have a solution to remove these options from the menu?

Thank you by advance!

EDIT

Thank you very much for your help, it helped me clarify my understanding of TinyMCE and its options.

So my question is actually: how to get rid of those: enter image description here

I'd like to offer the simplest user experience and these features seem too fine grain for my usecase.

Is there a way to make those disappear? (I also want to get rid of Row properties).

Upvotes: 0

Views: 1886

Answers (3)

Mels_D
Mels_D

Reputation: 109

A somewhat older thread, but I had the one or the other "problem" My little workaround is to enable the menu bar, change the table menu there and add a new table toolbar

fiddle: https://jsfiddle.net/9cf6swa1/

  tinymce.init({ 
      selector:'textarea' ,
      plugins: 'lists table',
      menubar: true,
        menu: {
    file: { title: 'File', items: '' },
    edit: { title: 'Edit', items: 'undo redo | cut copy paste pastetext | selectall | searchreplace' },
    view: { title: 'View', items: ''},
    insert: { title: 'Insert', items: 'link inserttable charmap ' },
    format: { title: 'Format', items:  ''},
    tools: { title: 'Tools', items:  '' },
    table: { title: 'Table', items: 'inserttable | row column |   deletetable' },
    help: { title: 'Help', items: 'help' }
  },
      toolbar: 'undo redo | formatselect | bold italic underline | bullist numlist ',
      table_advtab: false,
      table_row_advtab: false,
      table_cell_advtab: false,
      table_toolbar: 'tabledelete | tableinsertrowbefore tableinsertrowafter tabledeleterow | tableinsertcolbefore tableinsertcolafter tabledeletecol', 

    });

Upvotes: 0

Michael Fromin
Michael Fromin

Reputation: 13744

In your JS Fiddle those options are doing exactly what they are intended to do ... they remove an advanced tab of options from the Table, Cell, and Row properties dialogs. If you comment them out you will notice an Advanced tab appears in each of those dialogs.

For example, here is the Cell Properties dialog with your settings:

enter image description here

Here is the same dialog with the table_cell_advtab option removed:

enter image description here

EDIT: Based on your comments to my reply let me add some additional details...

If you want to completely remove options from the menubar/menus you have the ability to define exactly what is / is not on the menubar:

https://www.tiny.cloud/docs/configure/editor-appearance/#menu

Please note that once you decide to do this you have to explicitly state everything you want on the menus. The documentation page I reference shows the defaults for TinyMCE 5.

In addition, you likely want to look at what you have configured on the toolbar as well to ensure that you don't show anything you don't want on the main toolbar or the floating table toolbar:

https://www.tiny.cloud/docs/configure/editor-appearance/#toolbar https://www.tiny.cloud/docs/plugins/table/#table_toolbar

Upvotes: 2

James Wright
James Wright

Reputation: 153

If you only want to see some of the of the table properties in the Toolbar maybe try this

selector:'textarea' ,
                    plugins: 'lists table',
                    menubar: false,
                    toolbar: 'undo redo | formatselect | bold italic underline | bullist numlist | tabledelete | tableinsertrowbefore tableinsertrowafter tabledeleterow | tableinsertcolbefore tableinsertcolafter tabledeletecol\n',
                    table_advtab: false,
                    table_row_advtab: false,
                    table_cell_advtab: false

If I am understanding your question correctly

Upvotes: 1

Related Questions