2ヵ月前にこのブログで、TinyMCE Advanced が 5.2.0 にアップッデートされてから、テーブルのセルの枠線のドラッグを無効にして勝手に width や height が設定されないようにしてても、テーブルを挿入する際に強制的に全てのセルに均等の width が設定されてしまうことを書きました。
（TinyMCE Advanced のテーブルで勝手に設定される width 対策（妥協策））

その際は、width を設定させない解決策が見つからず、妥協策としてドラッグでサイズを調整できるという利便性を受け入れることにしたのですが、新規に制作するサイトはそれでもいいのですが、過去に制作したサイトは操作方法が変わってしまうので、TinyMCE Advanced をアップデートしないようにしていました。

しかし、セキュリティ面からもいつまでもアップデートしない訳には行かず、再度 width を設定させない方法を探ってみました。

すると、以前は見つからなかったのですが、アップデートから数ヶ月経ったこともあってか、対策法を紹介されている記事がいくつか見つかりました。

その対策法は functions.php に以下の記述を追加するというものです。

function tinymce_custom($settings) {
  $invalid_style = array(
    'table' => 'width height',
    'th' => 'width height',
    'td' => 'width height'
  );
  $mceInit['invalid_styles'] = json_encode($invalid_style);
  return $settings;
}
add_filter('tiny_mce_before_init', 'tinymce_custom', 0);

早速検証してみましたが、確かにテーブル挿入時の width は設定されませんが、この方法は table と th, td の width と height を無効にしてしまうので、テーブル挿入後にテーブルやセルのプロパティで任意の width を設定しようとしても無視されてしまいます。

任意の列幅を設定したい場合はセルのプロパティで設定するようにとマニュアルに書いているので、これでは特定の列の幅を固定したいとか、上下に並ぶ複数の表で列幅を揃えたいとかいう場合に困ります。

でもヒントを得たので、上記の設定をテーブル挿入時だけに適用する方法がある筈だと、さらに探してみたところ、2年前に書かれたものですが参考になる記事がありました。
DigiLoog » TinyMCEのTableタグ自動付与パラメータを書き換えた

先の functions.php の記述の $mceInit['invalid_styles'] を $mceInit['table_default_styles'] とすれば、テーブル挿入時だけに適用できるということですね。

こちらを参考に、結果的に以下の記述としました。

function tinymce_custom($settings) {
  $default_style = array(
    'border-collapse' => 'collapse'
  );
  $initArray['table_default_styles'] = json_encode($default_style);
  return $settings;
}
add_filter('tiny_mce_before_init', 'tinymce_custom', 0);

border-collapse: collapse; は私の場合外部 CSS ファイルで設定しているので実際は不要ですが、TinyMCE Advanced 5.2.0 からデフォルトで挿入されるようになってますし、編集画面で外部 CSS が読み込まれない場合を考慮して入れるようにしました。

また、TinyMCE Advanced 5.2.0 からは設定画面でドラッグでのテーブル、行、列のサイズ変更を無効にすることができるようになったので、今まで functions.php に書いていたテーブルのセルの枠線のドラッグを無効にする記述は削除しました。

これで、テーブル挿入時には width を設定しないので、従来どおりセル内の文字数等によって変化するようになり、TinyMCE Advanced の設定によって枠線のドラッグで幅や高さを設定できるようにするかどうかを選べるようになりました。