TinyMCEがTableタグに「width」と「height」を勝手に設定する機能を無効にする

WordPressがアップデートされてから、TinyMCEがTableタグに「width」と「height」を勝手に設定する機能が追加されました。レスポンシブデザインのサイトにおいて、この機能はむしろデザインを崩す原因となってしまいます。この機能を無効にする方法をご紹介します。

広告 (下に続く)

問題

TinyMCE 4.3.3 以上(WordPress 4.5 以上)においてテーブルの境界線を一度でも触ってしまうと、TinyMCEはTableタグに「width」と「height」を勝手に設定します。

広告 (下に続く)

対処方法

TinyMCEのオプション、「table_resize_bars」をFalseに変更します(初期値:True)。

TinyMCE単独で用いている場合

tinymce.init()の中に、 

table_resize_bars: false

を追加します。

WordPressで用いている場合

functions.phpなどに次のコードを追加します。

function customize_tinymce_settings($mceInit) {
 $mceInit['table_resize_bars'] = false;
 return $mceInit;
}
add_filter( 'tiny_mce_before_init', 'customize_tinymce_settings' ,0);

ちなみに、このコードを用いれば、TinyMCEのマニュアルを参考に他の設定もカスタマイズできます。

広告 (下に続く)

結果

テーブルの境界線を触っても何も起きません。ただし、四辺の□ボックスを移動するとテーブル全体のサイズが定義されてしまうのでご注意ください。

シェアする