ACFをカスタマイズしてWYSIWYG（リッチエディタ）にテキストの背景色を追加する

Advanced Custom Fields (ACF)のカスタムフィールドをカスタマイズして、WYSIWYG（リッチエディタ）にテキストの背景色をつける設定を追加します。

ACFの設定

WYSIWYGエディタのメニューバーにはFullとBasicの2つの設定があります。

↓BasicとFullの違いは以下の通りです。

ACF > 設定 >フィールドグループの設定のツールバーから選択可能です。
テキスト色の変更やインデントなど細部のレイアウトも調整したい場合はFullを選択してください。

Fullのメニューバーで一部ツールが隠れてる場合があります。ツールバー切り替えアイコンをクリックすると隠れている項目が表示されます。

カスタマイズの実装コード

functions.phpにコードを次のコードを追加します。これだけ！

function customize_acf_wysiwyg_toolbar( $toolbars ) {
	if (($key = array_search('backcolor' , $toolbars['Full'][2])) !== true) {
	  array_push($toolbars['Full'][2], 'backcolor');
	}
	return $toolbars;
}
add_filter('acf/fields/wysiwyg/toolbars' , 'customize_acf_wysiwyg_toolbar');

backcolorで背景色を指定しています。

背景色の項目が追加されました！

参考サイト

フォントサイズの変更のカスタマイズを行ってるこちらのサイトを参考にさせてもらいました。