TinyMCE Advanced の設定（見出し、テーブル）

ビジュアルエディタをカスタマイズできる便利なプラグイン「TinyMCE Advanced」ですが、状況に応じてその動作そのものを設定する必要があります。メニュー自体の選択は管理画面で設定できますが、その以外の設定はfunction.phpに記述することになるようです。

「段落」メニューの見出し内容を独自に設定する

エディタ内で使用する見出しとしてh1やh2を使うことは、大抵の場合少ないので選択肢を変更します。

function.php

//管理画面の「見出し１」等を削除する
function custom_editor_settings( $initArray ){
    $initArray['block_formats'] = "段落=p; 見出し2=h2; 見出し3=h3; 見出し4=h4;";
    return $initArray;
}
add_filter( 'tiny_mce_before_init', 'custom_editor_settings' );

参照元: WordPress管理画面のビジュアルエディタで「見出し１」等を削除する方法 | WebデザイナーFAN

テーブルの自動整形機能を無効化する

TinyMCE Advanced を使用する個人的な一番の理由として挙げられるのは、テーブル作成機能です。カスタムフィールドを使ってテーブル表示をする方法が使えないほどに、項目内容がバラバラだったり内容に合わせてセルの結合をしたいときに利用するケースが多いと思いますが、ネックになるのは自動整形機能です。

ビジュアルエディタでテーブルをドラッグでサイズ変更をすると、セルにstyle属性がついてレズポンシブ対応上不都合なので該当機能を停止させます。設定すると、テーブルがドラッグできなくなります。

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

参照元: TinyMCEがTableタグに「width」と「height」を勝手に設定する機能を無効にする | まっしろブログ

関数をまとめる

以上の内容を1つの関数にまとめると下記のようになります。

function customize_tinymce_settings($mceInit) {
    // テーブル要素へのstyle自動付加の停止
    $mceInit['table_resize_bars'] = false;
    $mceInit['object_resizing'] = "img";
    // 管理画面の「見出し1」等を削除する
    $mceInit['block_formats'] = "段落=p; 見出し4=h4; 見出し5=h5;";
    return $mceInit;
}
add_filter( 'tiny_mce_before_init', ‘customize_tinymce_settings', 0);

以上です。