TinyMCEをカスタマイズする

ダウンロード

Tiny MCEでフォントファミリーを選択できるようにしても、欧文フォントしか無かったり、指定したいフォントが無かったりした時にのために、カスタマイズできるようにしたいと思います。

functions.phpに以下を追加

add_filter('tiny_mce_before_init', function($settings){
		$settings['font_formats'] =
		"Century Gothic='Century Gothic';" "Franklin Gothic Medium='Franklin Gothic Medium';" "Gulim='Gulim';" "Impact='Impact';" "Verdana='Verdana';" "Georgia='Georgia';" "Times New Roman='Times New Roman';" "Courier New='Courier New';" "Comic Sans MS='Comic Sans MS';" "ＭＳ Ｐゴシック='ＭＳ Ｐゴシック','MS PGothic';" "ＭＳ ゴシック='ＭＳ ゴシック','MS Gothic';" "游ゴシック='游ゴシック','Yu Gothic';" "ヒラギノ角ゴ='ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN';" "ヒラギノ丸ゴ='ヒラギノ丸ゴ Pro W4','Hiragino Maru Gothic Pro','ヒラギノ丸ゴ ProN W4','Hiragino Maru Gothic ProN';" "ＭＳ Ｐ明朝='ＭＳ Ｐ明朝','MS PMincho';" "ＭＳ 明朝='ＭＳ 明朝','MS Mincho';" "游明朝='游明朝','Yu Mincho';" "ヒラギノ明朝='ヒラギノ明朝 Pro W3','Hiragino Mincho Pro',ヒラギノ明朝 ProN W3','Hiragino Mincho ProN';" "游明朝体='游明朝体','YuMincho';";
		return $settings;
	});

本来はこのように書けばOKなんですが、管理がしにくいので以下のように書き換えてみました。

add_filter('tiny_mce_before_init', function($settings){
		$settings['font_formats'] =
		"Century Gothic='Century Gothic';".
		"Franklin Gothic Medium='Franklin Gothic Medium';".
		"Gulim='Gulim';".
		"Impact='Impact';".
		"Verdana='Verdana';".
		"Georgia='Georgia';".
		"Times New Roman='Times New Roman';".
		"Courier New='Courier New';".
		"Comic Sans MS='Comic Sans MS';".
		"ＭＳ Ｐゴシック='ＭＳ Ｐゴシック','MS PGothic';".
		"ＭＳ ゴシック='ＭＳ ゴシック','MS Gothic';".
		"游ゴシック='游ゴシック','Yu Gothic';".
		"ヒラギノ角ゴ='ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN';".
		"ヒラギノ丸ゴ='ヒラギノ丸ゴ Pro W4','Hiragino Maru Gothic Pro','ヒラギノ丸ゴ ProN W4','Hiragino Maru Gothic ProN';".
		"ＭＳ Ｐ明朝='ＭＳ Ｐ明朝','MS PMincho';".
		"ＭＳ 明朝='ＭＳ 明朝','MS Mincho';".
		"游明朝='游明朝','Yu Mincho';".
		"ヒラギノ明朝='ヒラギノ明朝 Pro W3','Hiragino Mincho Pro',ヒラギノ明朝 ProN W3','Hiragino Mincho ProN';".
		"游明朝体='游明朝体','YuMincho';"
		;
		return $settings;
	});

フォントファミリー選択

実際に選択できるようになってるか確認してみます。

1.管理画面

2.表示画面

注意点

「;」や「””」の付け忘れ、つけ間違えると投稿機能自体が使えなくなってしますので、必ず編集する前にバックアップをとり、慎重に作業しましょう。

ダウンロード