CODEWITHSUNDEEP
tinymce
Patryk Grzyb
Patryk Grzyb

Reputation: 35

Turn off auto style in tables [Tinymce]

As there is no more Tinymce forum if I can ask is there way to turn off in tables function with adding style="width: or height:" to the source code.

Thank you

Upvotes: 2

Views: 4794

Answers (2)

Chris Wheeler
Chris Wheeler

Reputation: 1736

I worked around this by adding the following to the tinymce configuration:

invalid_styles: 'width height'

This strips width and height stlyes from all elements, which worked for my use case. I believe you may be able to specify which elements this applies to as well (e.g. table, tr, th, td).

invalid_styles: { 
    'table': 'width height', 
    'tr' : 'width height',
    'th' : 'width height',
    'td' : 'width height'
}

See https://www.tiny.cloud/docs/tinymce/6/content-filtering/#invalid_styles

Upvotes: 10

Michael Fromin
Michael Fromin

Reputation: 13744

When you first insert a table TinyMCE should not be using a width or height to define the table. When you drag to resize the column width or row height it will add these in order to set the width or height of the column/row as needed.

Are you seeing this issue when first inserting the table via Table / Insert? Are you seeing this after resizing a row or column?

EDIT: If this is happening when you are "just typing text" I have a hunch what might be happening...

When you insert a new/empty table there will be no inline styles on it at all. If you just start typing text into cells there should continue to not be any inline styles.

If, however, you use your mouse to move into a new/empty cell sometimes (if you click on the cell border and not inside the cell) you will see the borders momentarily turn blue when you click your mouse. When you see that blue appear TinyMCE is trying to set the "size" of the row or column on which you clicked. If instead of clicking into the small/empty cell you use your keyboard to move between cells I bet you won't get any inline styles.

The clicking on the borders is trigging code to handle manual resize events via the mouse.

Upvotes: 0

Related Questions