2014/05/01

[wordpress] カスタムフィールドを追加する方法

カテゴリー:
タグ:

カスタム投稿タイプの使い方カスタムタクソノミーの使い方について前に書きましたが、カスタム投稿タイプを使うなら、ぜひとも使った方がいい機能「カスタムフィールドの追加」について、今回は書いていきたいと思います。投稿画面に好きな項目を設定できるようになり、入力項目が決まっている場合には、投稿が楽になります。

カスタムフィールドについて

カスタムフィールドは、すでに投稿の編集画面に導入されています。画面上に表示されていない場合は、表示オプションからカスタムフィールドを表示するように設定してみましょう。エディタの下にカスタムフィールドが表示されるようになります。

このカスタムフィールドを使えば、項目名を選んで、値を設定するということができます。例えば、本の紹介するブログを作った場合、本のタイトル、著者名、自分の評価など、毎回決まって入力する項目があるとします。それを毎回エディタに書くのもいいのですが、カスタムフィールドを使えば、カスタムフィールドの表示場所の変更によりブログの記事のレイアウトを簡単に変えることができます。また、評価の高い順に記事を並べるなどといったこともできるようになります。

カスタムフィールドを使えば、このような使い方ができるのですが、毎回カスタムフィールドから項目を選んで値を書くというのはめんどうです。なので、カスタムフィールドを追加した投稿タイプを作っておくと便利ですね。値の入力漏れも減りますね。

カスタムフィールドの追加の仕方

カスタムフィールドの追加は、カスタム投稿タイプやカスタムタクソノミーの時とは異なり、ちょっと面倒です。カスタムフィールドを追加するためにしないといけないことは、記事の編集画面でカスタムフィールドを追加して表示することと、記事の更新時に追加したカスタムフィールドの値を保存することの2つです。それぞれ見ていきましょう。

編集画面にカスタムフィールドを追加する

まずは、編集画面にカスタムフィールドを追加するプログラムを見ていきます。functions.phpに下のように追加します。

add_action('admin_menu', 'my_add_meta_box');
function my_add_meta_box() {

  add_meta_box(
    'book_title'
    , '本のタイトル'
    , 'my_add_meta_box_html'
    , 'book'
    , 'advanced'
    , 'low'
//  , 'callback_args'
  );
}

本質的な部分は、add_meta_boxのところです。1つ目の引数は、セクションのHTMLのIDになります。2つ目がセクションのタイトル、3つ目はセクションをHTMLでどう出力するかを記述する関数の名前を書きます。別途関数を作成する必要があります。4つ目は、このセクションを表示する投稿タイプですね。上の設定では、bookという名前のカスタム投稿タイプを選ぶと、「本のタイトル」という項目が表示されることになります。

5つ目はセクションが表示される部分です。デフォルトでは、advancedとなっていますが、そのままでいいと思います。wordpressのバージョンが2.7以降であれば、sideも指定できます。6つ目は表示される優先度です。そして、上では指定していませんが、3つ目で指定した関数に渡す値を一番最後に設定することができます。

最後の引数について少し補足します。フィールドは一般的にはテキストフィールドだと思いますが、ラジオボタンやチェックボックスにしたいこともあります。このときに、選択肢を配列として渡し、HTMLの表示に使う、といった方法をとることができます。下のような感じですね。

add_action('admin_menu', 'my_add_meta_box');
function my_add_meta_box() {

  add_meta_box(
    'book_rank'
    , '本の評価'
    , 'my_add_meta_box_html'
    , 'book'
    , 'advanced'
    , 'low'
    , array('☆☆☆', '★☆☆', '★★☆', '★★★')
  );
}
function my_add_meta_box_html($post, $metabox){
  for($i=0; $i<count($metabox['args']); $i=$i+1){
    $rank = $metabox['args'][$i];
    echo '<label><input type="radio" name="book_rank" value="' . $rank . '"';
    if ( get_post_meta($post->ID, 'book_rank', true) == $rank ) echo ' checked';
    echo ' />' . $rank . '</label><br />';
  }
}

argsでアクセスできるんですね。追加するフォームが一つしかなければあまりありがたみがわかりませんが、複数のフォームを追加する場合には使えます。add_meta_boxについて、公式のリファレンスを載せておきます。

関数リファレンス/add meta box – WordPress Codex 日本語版

ただ、この状態で編集画面を使用しても、フィールドの値が保存されません。入力ができても保存されなければ意味がありません。フィールドの保存は、次のように別途プログラムを書く必要があります。

カスタムフィールドの値の保存

編集画面にカスタムフィールドが出るようになったら、次はその値の保存です。functions.phpに追加します。

add_action('save_post', 'my_update_post_meta');
function my_update_post_meta( $post_id ) {
  update_post_meta($post_id, 'book_rank', $_POST['book_rank']);
}

update_post_metaで値の保存をしています。1つ目の引数は投稿のID、2つ目はカスタムフィールドのキーです。3つ目はカスタムフィールドの値です。上の例では4つ目の引数を載せていませんが、オプションとして古いカスタムフィールドのキーを設定することができます。4つ目の引数は、例えば、著者名というカスタムフィールドがあって、そのうちの一人の著者について名前を変える、などといったときに使います。カスタムフィールドを追加する段階では、あまり使うことのない引数だと思います。

さて、上ではとても簡単に書きましたが、本来は入力値の精査をするべきです。入力値の精査については、上に記載したadd_meta_boxのページに詳しく載っています。

これらによって、値の保存まですることができるようになりました。

おまけ:postやpageにカスタムフィールドを追加する方法

ここまで、カスタム投稿タイプにカスタムフィールドを追加する方法を書いてきましたが、既にある投稿タイプpostやpageに対してもカスタムフィールドを追加する時も同様です。add_meta_boxの4つ目の引数はカスタムフィールドを追加する投稿タイプを指定しますが、そこにpostやpageを指定すれば実現できます。

前の記事:
次の記事: