かもメモ

自分の落ちた落とし穴に何度も落ちる人のメモ帳

Wordpress CMB2 1行text(input)フィールドでHTMLタグを入力できるようにしたい。

WordPressにコードベースでカスタムフィールドを作成することが出来るCMB2。

とても便利なのですが、
1行textフィールド(通常のinput[type="text"])はデフォルトだとHTMLタグを保存時に除去(sanitization)する仕様になっていました。(以前はサニタイズされてなかった気がするのだけど...)
HTMLタグが入るなら最初からtextareaにしとけば良いだけなのですが、運用段階でやっぱりこのフィールドにHTMLタグ入れたいんだよね。とかが発生する可能性は無きにもあらずです。

例えば、こんな感じで改行いれたいとか。
f:id:kikiki-kiki:20171110203347p:plain

sanitization_cb を使って独自のサニタイズ処理を適応する

sanitization_cb
Bypass the CMB sanitization (sanitizes before saving) methods with your own callback. Set to false if you do not want any sanitization (not recommended).

サニタイズを変更したいフィールドのを作成している箇所にsanitization_cbプロパティを作成し、値にデータ保存前に値を処理するコールバック関数名を指定します。

<?php // function.php
// <中略>

$cmb->add_field([
  'id'     => $fieldID,
  'name'   => '発売日',
  'type'   => 'text',
  // sanitaize callback
  'sanitization_cb' => 'cmb_allow_html_cb',
]);

// <中略>

/**
 *  Sanitization Handler: Allow HTML tag
 * @param  mixed      $value      The unsanitized value from the form.
 * @param  array      $field_args Array of field arguments.
 * @param  CMB2_Field $field      The field object
 *
 * @return mixed                  Sanitized value to be stored.
 */
function cmb_allow_html_cb($value, $field_args, $field) {
  // 保存する値を返す
  return wp_kses_post( $value );
}

コールバック関数は最後に保存する値をreturnします。
上の例では、値を保存する前に行われるコールバック関数でwp_kses_post()を使ってWordPressの投稿コンテンツと同じHTMLタグが使える様にしています。

これで、この1行テキストの中では改行<br>を始めとするHTMLタグを使うことが出来るようになりました!

加工したい形式ごとに処理関数作成する手間がありますが、デフォルトの処理関数をバイパスできるので自由度が高いです!

公式リファレンスには同じような使い方のescape_cbというプロパティもありましたが、こちらはサニタイズ処理が終わった後で呼び出されるっぽく、既にHTMLが除去された値が$valueで渡されてきたので、HTMLタグを残したい場合には適していませんでした。


[参考]