TinyMCE エディタでフォントサイズを　em % rem　等のサイズで変更可能にする

デフォルトのビジュアルエディタには、フォントサイズを変更するボタンがない事にふと気が付きました。

テーマのフォーラムに寄せられた苦情が、その発端だったのですが、では、機能満載な「TinyMCE Advanced」プラグインを追加して見ようという事で試してみたのですが、ボタンは、設定からすぐに見つかりましたが、単位はptでした。

「pxサイズに変更したい場合はチェックボックスにチェックを入れてください」というオプションはありましたが　レスポンシブ対応等で、em rem %等の相対単位を使いたいところですね

フィルターを試してみたのでメモに残します。

まず、セレクトボックスをエディタに表示するフィルタ

functions.php

if ( ! function_exists( 'extend_mce_button' ) ) {
	function extend_mce_button( $buttons ) {
		array_unshift( $buttons, 'fontsizeselect' );
		return $buttons;
	}
}
add_filter( 'mce_buttons_2', 'extend_mce_button' );

セレクトボックスのフォントサイズを変更するフィルタ
（%の例です）

functions.php

add_filter( 'tiny_mce_before_init', 'my_mce_before_init',5 );
function my_mce_before_init( $settings ) {
 $settings['fontsize_formats']= "85% 100% 116%; 138.5% 153.9% 167% 182% 197%";
 return $settings;
}