WordPressで投稿や固定ページに本文の内容とは別のデータを任意に保存できる機能であるカスタムフィールド。
ブロックエディターの場合にはデフォルトで表示されていないので気づかない方もいるかも知れませんが、「ブロックオプション」の設定で表示させるようにすると、実にいろいろなデータが保存されているのが分かります。
例えば、プラグインが利用するデータとして、アクセス数やSEO向けのメタタグに入れる情報、エディター上で指定する有効／無効の設定などを保存していたり、更新日を一時格納していたりするのに利用されることが多いです。
ただ、これで表示されているのも氷山の一角で、以下の方法で隠しフィールドも含めて表示させると、いったいどれだけのデータが本文と別に格納されているの？と思えるほど様々なデータが付帯されていることにびっくりします。
カスタムフィールドは、メタキーと値がセットになっていて、投稿などの編集画面から操作する場合には、前述したカスタムフィールド欄を表示させて、都度メタキーと値を追加していくという管理の仕方が基本となっていて、保存したデータはショートコードなどを使って本文内に表示させるというのが一般的な使用方法ではあるものの、それではメタキーをいちいち覚えていないといけないので面倒。
そこで重宝するのが、カスタムフィールドの値の表示・入力・更新を行うための入力窓を用意してメタキーを覚えることなく、カスタムフィールドの一覧を常に表示することなくカスタムフィールドのキーと値を管理する方法。この入力窓のことをWordPressの用語でメタボックスと言います。
本ページではこのメタボックスの作成、既存のデータの表示、保存、ショートコードを使った本文内への表示方法など、カスタムフィールドを便利に使うための基本的な作法を紹介していきます。
本ページ掲載のコードを使用するときは
本ページで掲載しているコードは、以下に了承した上で使用ください
- コードは商用・非商用問わず自由に使っていただいて構いませんが、コード追加による不具合やトラブルが発生しても当方では一切責任を負いません
- コードは有効化しているテーマのfunctions.php、style.cssなどへ追加することで機能します。それらのファイルへの変更を行うことに不安のある方は使用しないでください
- コードは本ページの公開日時点で私の環境において動作したものです。WordPressバージョン他環境の違いによって動作しないことがあります
- コードは、セキュリティ、コードの正確さなどにおいて完全なものではありません。中には紹介するコードを簡略化するために省略している部分があるものもありますので、ご自身でコードを十分に検証し、必要な部分の編集を行った上で使用するようにしてください
- 掲載しているのは参考コードです。自身の環境に合わせるための編集はご自身で対応いただく必要があります（コメント欄等から質問いただいても基本回答は致しません）
- 掲載しているコードの転載を禁じます（SNSで紹介いただいたり、本ページへのリンクを張っていただくことは大歓迎です）
カスタムフィールドを扱うための基本的な手順
以下がカスタムフィールドを操作する一連の流れです。
- 目的の場所（投稿や固定ページ）へカスタムフィールドの値を表示、入力、修正するための入力窓（メタボックス）を作る
- メタボックスの中に表示させる内容（フォーム）を作る
- 投稿や固定ページの公開・更新ボタンクリック時にメタボックスの値も更新する
- カスタムフィールドの名前（キー）を登録する
- 保存されている値を本文内へ呼び出す
カスタムフィールドの入力窓の作成と保存
上記の1～4の内容は、基本的には以下のコードで実装できます。コードの後で、いろいろと解説します。
/***** メタボックスの表示とカスタムフィールドの更新 *****/
/* メタボックスを作る */
function pwcn_add_meta_panel() {
add_meta_box(
'pwcn-meta-panel', // 編集画面セクションのHTML要素のID
'メタボックスのタイトル', // 編集画面セクションのタイトル
'pwcn_add_meta_panel_callback', // 編集画面セクションにHTML出力する関数
'post', // 投稿タイプ
'normal',// 編集画面セクションが表示される部分
'high'//位置
);
}
add_action('admin_menu', 'pwcn_add_meta_panel');
/* メタボックスの内容を作る */
function pwcn_add_meta_panel_callback(){
//カスタムフィールドの設定
$field = get_post_meta(get_the_ID(), 'メタキー', true));
//表示する内容
?>
<textarea name="メタキー" id="メタキー" cols="100" rows="1"><?php echo ($field); ?></textarea>
<?php
}
/* カスタムフィールドの値を保存する処理 */
function pwcn__meta_panel_save($post_id){
//自動保存では更新しない
if(defined('DOING_AUTOSAVE') && DOING_AUTOSAVE)
return $post_id;
//一括更新では更新しない
if(isset($_POST['action']) && $_POST['action'] == 'inline-save')
return $post_id;
//情報の更新
if(isset($_POST['メタキー'])){
update_post_meta($post_id, 'メタキー', $_POST['メタキー']);
} else {
delete_post_meta($post_id, 'メタキー');
}
}
add_action('save_post', 'pwcn__meta_panel_save');
/***** カスタムフィールド（キー）の登録 *****/
function pwcn_register_meta_key(){
register_meta(
'post',
'メタキー',
array(
'show_in_rest' => true,
'single' => true,
'type' => 'string',
'default' => '',
)
);
}
add_action('init','pwcn_register_meta_key');コードは4つに分かれています。コード内の「メタキー」という部分は、投稿編集画面でいう「名前」の部分になりますので、同じものを設定するようにします。
メタボックスの表示と表示させる内容の設定
まず「 pwcn_add_meta_panel()」というユーザー定義関数で以下のことを行っています。
- どの投稿タイプの編集画面に入力窓（メタボックス）を表示させるのか？
- メタボックスの内容を表示させるのは何なのか？
- メタボックスを表示させる位置はどこなのか？
上記コードでは投稿タイプを「post」とし、「投稿」の画面に表示させるようにしています。
メタボックスの位置は「normal(本文の下)」なのか「side(サイドバー)」なのかを指定し、「high(なるべく上へ)」または「low(なるべく下へ)」のいずれかを指定します。
なるべく．．と書いたのは、メタボックスを表示させるプログラムの順によって前後することがあるからです
そして、メタボックスに表示させる内容として「pwcn_add_meta_panel_callback()」を指定しています。
このユーザー定義関数の内容自体は、一旦PHPを切ることでHTMLが使えるようになるので、上記コード例ではtextareaタグを使って必要項目を設定したり、表示させたりしています（基本的にnameとid要素はメタキーで構いませんし、変えるとかえって混乱するかもしれません）。
そして大事なのが、既に値がある場合には表示させることで、$fieldでカスタムフィールドの値を引き出して、textareaの初期値として出力させるようにしています（これを省くと編集画面を開いた際に項目が空になり、そのまま更新すると値が消えてしまいますので必ず設定するようにします）。
今回は複数行テキスト（textarea）タグを使っていますが、他にもいろいろと種類があるので、以下に基本的なタグや使い方の注意点などを掲載しておきます。
単一行テキスト(input)
<input type="text" name="メタキー" value="<?php echo $field ?>" size="60" />複数行テキスト(textarea)
<textarea name="メタキー" id="メタキー" cols="60" rows="4" /><?php echo $field ?></textarea>チェックボックス(input)
コードの?>の手前で以下を定義
if( $field == 1 ) {
$field_check = "checked";
} else {
$field_check = "/";
}
<input type="checkbox" name="メタキー" value="1" <?php echo $field_check ?>>ドロップダウンリスト(select)
<select name= 'メタキー' >
<option value='1' <?php selected('1', $field ); ?> selected >選択肢1のテキスト</option>
<option value='2' <?php selected('2', $field ); ?>>選択肢2のテキスト</option>
</select>ラジオボタン(input)
<ul>
<li><input name="メタキー" type="radio" id="メタキー" value="1" <?php checked( '1', $field ); ?> checked />選択肢1のテキスト</li>
<li><input name="メタキー" type="radio" id="メタキー" value="2" <?php checked( '2', $field ); ?> />選択肢2のテキスト</li>
</ul>また、メタボックスへは複数の項目を表示・管理できるので、$field変数とメタキーを変えてコードを追加していけばいいでしょう。
コードを完成させて保存した段階で、特に問題がなければ、投稿編集画面にメタボックスが表示されるはずです。表示されない場合は上記コードのどこかの部分で記述の誤りがありますので修正してください。
簡潔に紹介するため、コードには入力の制限やセキュリティに関するものを含んでいません。できるだけ安全に値の取り扱いができるよう、文末の「補足（セキュリティや入力制限など）」を必ず一読ください。
入力した値の更新・保存
「pwcn__meta_panel_save()」というユーザー定義関数でメタボックスの内容（項目）に入力した値を保存する処理をしています。
「下書き保存」「公開」「更新」など保存する処理をする際にメタボックス内の内容が上書きされます（空にすれば今まで保存されていた内容は破棄されます）。
これも「メタキー」の部分へメタボックスの内容のところと同じ文字列を入れればOKで、複数ある場合は以下の行を追加して処理させます。
//情報の更新
if(isset($_POST['メタキー'])){
update_post_meta($post_id, 'メタキー', $_POST['メタキー']);
} else {
delete_post_meta($post_id, 'メタキー');
}カスタムフィールドの名前（キー）を登録する
WordPress（サイト）でこれは一意のカスタムフィールドの名前（キー）ですよ！と登録するための措置ですが、これを行わなくてもメタボックスからのカスタムフィールドの追加・変更はできますし、次項の保存した値の呼び出しも問題なくできますから、一見不要なように思います（私自身も今までこのコードで登録したことはありません）。
しかし、WordPress6.5から利用できるようになった「Block Bindings API」を使って段落ブロックなどにカスタムフィールドの値を呼び出して表示する機能を使う場合などでは、この登録を行っていないカスタムフィールドの名前（キー）はサイトへ未登録＝無視されてしまうので、同時に登録しておくといいでしょう。
カスタムフィールドに保存した値を投稿の中へ呼び出す
これについては、以下のページで詳しく解説していますのでご覧ください（ショートコードを使う方法です）。
補足（セキュリティや入力制限など）
今回紹介したコードでは、できるだけ簡単に投稿編集画面へメタボックスを表示させ、値を更新するということが実装できるよう、値のチェック（制限）やセキュリティに関する記述はあえて加えていません。
WordPressに限らず、また、今回のようなメタボックスでのデータ入力などに限らず、誰かが何かを入力して、データとして保存するという処理をする際には、必ず意図した値以外のものを入力して保存できる状態になっていないか、その場所から入力されたものに間違いがないかという入力時のチェックを行うようにしましょう。
もちろん出力時に不正なものを出力（表示）させないということも大事ですが、まずはできるだけ確実に意図しないものを保存させない工夫をすることが個人的には大事だと思います。
以下のページでは、データのサニタイズ（無害化）と、入力セキュリティの1つであるnonceについて書いていますので、是非ご覧ください。
