WordPress│管理画面にカスタムフィールドの一覧･編集機能を作成する方法

2025.05.31

カスタムフィールドでデータを一覧する、または入力する際にまとめてやってしまいたいことがあります。

例えば有料記事の価格なのですが、管理画面に専用メニューを作ると時短になります。

本記事ではその作り方を紹介いたします。

ちなみにいろいろな技術記事を書いていますので、よかったら見てくださいませ。

WAZAの有料技術記事一覧

WordPressの管理画面にカスタムフィールドの一覧･編集機能を作成する方法

まずはカスタムフィールドを用意しましょう。

今回は価格（price）というカスタムフィールドを作成します。

いつもであればACFかSCFのプラグインでカスタムフィールドを作成するのですが、一つであればfunctions.phpで書いてしまいます。

カスタムフィールドの作成

functions.phpに下記のコードを挿入します。

エラーが怖い人はCode Snippetsのプラグインを入れて、そこからコードを挿入しましょう。

// 投稿画面にカスタムフィールドエリアを追加
add_action('admin_menu', function () {
  add_meta_box(
    'custom_price_box',
    '価格',
    'render_custom_price_field',
    'post',
    'side',
    'default'
  );
});

// 入力欄の出力
function render_custom_price_field($post)
{
  wp_nonce_field('save_custom_price', 'custom_price_nonce');
  $price = get_post_meta($post->ID, 'price', true);
  echo '<label for="price">価格（円）</label>';
  echo '<input type="number" id="price" name="price" value="' . esc_attr($price) . '" style="width:100%;" />';
}

// 保存処理
add_action('save_post', function ($post_id) {
  if (!isset($_POST['custom_price_nonce']) || !wp_verify_nonce($_POST['custom_price_nonce'], 'save_custom_price')) return;
  if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) return;
  if (isset($_POST['price'])) {
    update_post_meta($post_id, 'price', sanitize_text_field($_POST['price']));
  }
});