この記事は最終更新日から2年以上が経過しており、情報が古くなっている可能性があります。

カスタムフィールドでビジュアルエディタを使う場合には最初からAdvanced Custom Fieldsとかを入れておけば良いのですが、Custom Field GUI Utilityを組み込んで一通り構築してしまった後で「ついでにちょっとカスタムフィールドでもビジュアルエディタを使えるようにして下さい^^」とか平気で言ってくるお客様が後を断たないので何とかする方法をメモっておきます。


function.phpに以下のコードを貼付けます。

function admin_add_wysiwyg_custom_field_textarea()
{ ?>
<script type="text/javascript">/* <![CDATA[ */
jQuery(function($){
var i=1;
$('#cfg_カスタムフィールドのキー').each(function(e)
{
var id = $(this).attr('id');
if (!id)
{
id = 'customEditor-' + i++;
$(this).attr('id',id);
}
tinyMCE.execCommand('mceAddControl', false, id);
});
});
/* ]]> */</script>
<?php }
add_action( 'admin_print_footer_scripts', 'admin_add_wysiwyg_custom_field_textarea', 99 );

次にcustom-field-gui-utilityディレクトリ内のcfg-utility.phpを以下のように書き換えます。

<textarea class="data {$validation}" id="{$name}" name="{$name}" type="textarea" rows="{$rows}" cols="{$cols}">{$value}</textarea>
↓↓↓
<textarea class="data theEditor {$validation}" id="{$name}" name="{$name}" type="textarea" rows="{$rows}" cols="{$cols}">{$value}</textarea>

最後にTinyMCE Buttons Arrangementプラグインを導入して完成です。