![利用するメリット
とあるプラグインを例に挙げると、
カテゴリーにカスタムフィールドを追加した際にデータが保存され
るのは、termmetaテーブルではなくoptionsテーブル。
option_name
→[タクソノミー名]_[term_id]_[管理画面で指定するフィールドの名前]](https://image.slidesharecdn.com/termmetadata-160710030201/75/term-metadata-25-2048.jpg?cb=1667964397)
![2. カテゴリー新規追加画面に入力フィールド
//よみがなのHTML
<div class="form-field term_kana-wrap">
<label for="term_kana">{$meta_array['term_kana']['name']}</label>
<input name="term_kana" id="term_kana" type="text" value="" size="40">
<p>{$meta_array['term_kana']['note']}</p>
</div>
カテゴリー新規追加画面はそれぞれ
の入力フィールドをdivで分ける。](https://image.slidesharecdn.com/termmetadata-160710030201/75/term-metadata-40-2048.jpg?cb=1667964397)
![2. カテゴリー新規追加画面に入力フィールド
//おすすめマークのHTML
<div class="form-field osusume_flag-wrap">
<label for="osusume_flag">{$meta_array['osusume_flag']['name']}</label>
<ul>
<li><label><input type="radio" name="osusume_flag" value="0"
checked>非表示</label></li>
<li><label><input type="radio" name="osusume_flag" value="1">表示
</label></li>
</ul>
<p>{$meta_array['osusume_flag']['note']}</p>
</div>](https://image.slidesharecdn.com/termmetadata-160710030201/75/term-metadata-41-2048.jpg?cb=1667964397)
![2. カテゴリー編集画面に入力フィールド
//よみがなのHTML
<tr class="form-field term_kana-wrap">
<th scope="row"><label
for="term_kana">{$meta_array['term_kana']['name']}</label></th>
<td>
<input name="term_kana" id="term_kana" type="text"
value="{$term_kana_value}" size="40">
<p class="description">{$meta_array['term_kana']['note']}</p>
</td>
</tr>
カテゴリー編集画面はそれぞれの入
力フィールドをtable要素で分ける。](https://image.slidesharecdn.com/termmetadata-160710030201/75/term-metadata-46-2048.jpg?cb=1667964397)
![2. カテゴリー編集画面に入力フィールド
//おすすめマークのHTML
<tr class="form-field osusume_flag-wrap">
<th scope="row">{$meta_array['osusume_flag']['name']}</th>
<td>
<ul>
<li><label><input type="radio" name="osusume_flag"
value="0"{$osusume_flag_0}>非表示</label></li>
<li><label><input type="radio" name="osusume_flag"
value="1"{$osusume_flag_1}>表示</label></li>
</ul>
<p class="description">{$meta_array['osusume_flag']['note']}</p>
</td>
</tr>](https://image.slidesharecdn.com/termmetadata-160710030201/75/term-metadata-47-2048.jpg?cb=1667964397)
![4. 保存と削除のプログラム
function update_term_meta_array( $term_id ) {
$meta_array = return_meta_array();
foreach ( $meta_array as $meta_key => $value ) {
if ( ! isset( $_POST[$meta_key] ) || ! stripslashes_deep( $_POST[$meta_key] ) ) {
delete_term_meta( $term_id, $meta_key, get_term_meta( $term_id, $meta_key,
true ) );
} elseif ( ! get_term_meta( $term_id, $meta_key ) ) {
add_term_meta( $term_id, $meta_key, stripslashes_deep( $_POST[$meta_key] ),
true );
} elseif ( stripslashes_deep( $_POST[$meta_key] ) != get_term_meta( $term_id,
$meta_key, true ) ) {
update_term_meta( $term_id, $meta_key, stripslashes_deep( $_POST[$meta_key] ) );
}
}
}
add_action( 'created_category', 'update_term_meta_array' );
add_action( 'edited_category', 'update_term_meta_array' );
フィールドの配列をループで回し
て一気に処理する。](https://image.slidesharecdn.com/termmetadata-160710030201/75/term-metadata-49-2048.jpg?cb=1667964397)
これから使おう！Term metadataの使い方
•4 likes•1,690 views
Report
Share
Download to read offline
WordCamp Kansai 2016で行ったセッションのスライドです。
More Related Content
Similar to これから使おう！Term metadataの使い方
Similar to これから使おう！Term metadataの使い方(20)
Recently uploaded
これから使おう！Term metadataの使い方
- 2. 自己紹介 • 小川 果純（おがわ かすみ） • WordPressエンジニア ↓ セールスエンジニア ↓ Webディレクター兼Webエンジニア ←いまここ • カピバラとポテチとピザが好き • Facebook: kasumi.ogawa.399 • https://minkapi.style/
- 4. 突然ですが…
- 10. Term Metadataとは • WordPress4.4で実装された、投稿のメタ情報のカテゴリー版。 • termmetaというテーブルが追加。 • termmeta用の関数ももちろん追加。
- 15. カスタムフィールドがない！？
- 19. 面倒！！！！
- 21. しかも
- 24. 利用するメリット
- 26. 利用するメリット Term Metadata実装前にこういった機能を実現していたプラグイ ンは以下の対応がほとんど。 • optionsテーブルに独自のoption_nameをつけて保存 • 独自テーブルを追加し、そこに保存
- 30. 利用するメリット • 独自テーブルを追加し、そこに保存 ×データの保存の仕方がプラグインの実装に依存してしまう →他のプラグインに変えることが難しくなる ×Term Metadata実装により、termmetaテーブルと独自 テーブルの名前が被ってしまい、「そのプラグイン使ってたら WordPressアップデートできない問題」が多発 Term Metadataなら 問題なし！！
- 31. でも、実装方法がわからない…
- 32. 管理画面の実装方法
- 34. 管理画面の実装方法 1. 必要なメタ情報とメタキー名などを決める 2. カテゴリー新規追加画面に入力フィールド 3. カテゴリー編集画面に入力フィールド 4. 保存と削除のプログラム 5. ポイント
- 35. 1. 必要なメタ情報とメタキー名などを決める 2. おすすめマークの表示・非表示 メタキー：osusume_flag 1. カテゴリーのよみがな メタキー：term_kana
- 36. 1. 必要なメタ情報とメタキー名などを決める $meta_array = array( 'term_kana' => array( 'name' => 'よみがな', 'note' => 'よみがなを入力してください', ), 'osusume_flag' => array( 'name' => 'おすすめマーク', 'note' => 'おすすめマークを表示する際は表示にチェックを入れてください‘, ), ); 新規追加画面と編集画面、 それぞれにフィールドを実装する必 要があるので、フィールド名と注釈は 連想配列で管理する。
- 37. 1. 必要なメタ情報とメタキー名などを決める function return_meta_array() { $meta_array = array( 'term_kana' => array( 'name' => 'よみがな', 'note' => 'よみがなを入力してください', ), 'osusume_flag' => array( 'name' => 'おすすめマーク', 'note' => 'おすすめマークを表示する際は表示にチェックを入れてください‘, ), ); return $meta_array; } その配列を返す関数にしておく。
- 38. 2. カテゴリー新規追加画面に入力フィールド function add_termmeta_form() { $meta_array = return_meta_array(); array_map( "esc_html", $meta_array ); $html = <<<EOM //よみがなのHTML //おすすめマークのHTML EOM; echo $html; } メタ情報配列を取得して、array_map() を使用して各要素にesc_html()の処 理を行い、エスケープする。
- 39. 2. カテゴリー新規追加画面に入力フィールド function add_termmeta_form() { $meta_array = return_meta_array(); array_map( "esc_html", $meta_array ); $html = <<<EOM //よみがなのHTML //おすすめマークのHTML EOM; echo $html; } add_action( 'category_add_form_fields', 'add_termmeta_form' ); category_add_form_fieldsにフックし、 カテゴリー新規追加画面に入力 フィールドを追加する。
- 40. 2. カテゴリー新規追加画面に入力フィールド //よみがなのHTML <div class="form-field term_kana-wrap"> <label for="term_kana">{$meta_array['term_kana']['name']}</label> <input name="term_kana" id="term_kana" type="text" value="" size="40"> <p>{$meta_array['term_kana']['note']}</p> </div> カテゴリー新規追加画面はそれぞれ の入力フィールドをdivで分ける。
- 41. 2. カテゴリー新規追加画面に入力フィールド //おすすめマークのHTML <div class="form-field osusume_flag-wrap"> <label for="osusume_flag">{$meta_array['osusume_flag']['name']}</label> <ul> <li><label><input type="radio" name="osusume_flag" value="0" checked>非表示</label></li> <li><label><input type="radio" name="osusume_flag" value="1">表示 </label></li> </ul> <p>{$meta_array['osusume_flag']['note']}</p> </div>
- 43. 2. カテゴリー編集画面に入力フィールド function edit_termmeta_form( $tag, $taxonomy ) { $meta_array = return_meta_array(); array_map( "esc_html", $meta_array ); //現在保存されている値の取得 $html = <<<EOM //よみがなのHTML //おすすめマークのHTML EOM; echo $html; } 編集画面では、現在編集を行ってい るタームとタクソノミーの情報が引数 として受け取れる。
- 44. 2. カテゴリー編集画面に入力フィールド function edit_termmeta_form( $tag, $taxonomy ) { $meta_array = return_meta_array(); array_map( "esc_html", $meta_array ); //現在保存されている値の取得 $html = <<<EOM //よみがなのHTML //おすすめマークのHTML EOM; echo $html; } add_action( 'category_edit_form_fields', 'edit_termmeta_form', 10, 2 ); category_edit_form_fieldsにフックし、 カテゴリー編集画面に入力フィールド を追加する。
- 45. 2. カテゴリー編集画面に入力フィールド //現在保存されている値の取得 $term_kana_value = ''; $osusume_flag_value = ''; $term_kana_value = esc_attr( get_term_meta( $tag->term_id, 'term_kana', true ) ); $osusume_flag_value = esc_attr( get_term_meta( $tag->term_id, 'osusume_flag', true ) ); if ( $osusume_flag_value == 1 ) { $osusume_flag_1 = ' checked'; $osusume_flag_0 = ''; } elseif ( $osusume_flag_value == 0 ) { $osusume_flag_1 = ''; $osusume_flag_0 = ' checked'; } get_term_meta()で現在保存されてい る値を取得する。
- 46. 2. カテゴリー編集画面に入力フィールド //よみがなのHTML <tr class="form-field term_kana-wrap"> <th scope="row"><label for="term_kana">{$meta_array['term_kana']['name']}</label></th> <td> <input name="term_kana" id="term_kana" type="text" value="{$term_kana_value}" size="40"> <p class="description">{$meta_array['term_kana']['note']}</p> </td> </tr> カテゴリー編集画面はそれぞれの入 力フィールドをtable要素で分ける。
- 47. 2. カテゴリー編集画面に入力フィールド //おすすめマークのHTML <tr class="form-field osusume_flag-wrap"> <th scope="row">{$meta_array['osusume_flag']['name']}</th> <td> <ul> <li><label><input type="radio" name="osusume_flag" value="0"{$osusume_flag_0}>非表示</label></li> <li><label><input type="radio" name="osusume_flag" value="1"{$osusume_flag_1}>表示</label></li> </ul> <p class="description">{$meta_array['osusume_flag']['note']}</p> </td> </tr>
- 49. 4. 保存と削除のプログラム function update_term_meta_array( $term_id ) { $meta_array = return_meta_array(); foreach ( $meta_array as $meta_key => $value ) { if ( ! isset( $_POST[$meta_key] ) || ! stripslashes_deep( $_POST[$meta_key] ) ) { delete_term_meta( $term_id, $meta_key, get_term_meta( $term_id, $meta_key, true ) ); } elseif ( ! get_term_meta( $term_id, $meta_key ) ) { add_term_meta( $term_id, $meta_key, stripslashes_deep( $_POST[$meta_key] ), true ); } elseif ( stripslashes_deep( $_POST[$meta_key] ) != get_term_meta( $term_id, $meta_key, true ) ) { update_term_meta( $term_id, $meta_key, stripslashes_deep( $_POST[$meta_key] ) ); } } } add_action( 'created_category', 'update_term_meta_array' ); add_action( 'edited_category', 'update_term_meta_array' ); フィールドの配列をループで回し て一気に処理する。
- 50. 5. ポイント 1. nonceの実装は不要！ →デフォルトのカテゴリー新規追加画面や編集画面に実装されている nonceと、同一のformタグに囲まれているため。 2. サニタイズ処理は不要！ →それぞれの関数の中で、サニタイズやアンサニタイズ処理が行われ ている。 3. 適宜入力内容のチェックなどを実装しよう！
- 51. フロント画面の実装方法
- 52. <?php $categories = get_categories(); ?> <ul> <?php foreach ($categories as $category) : $cat_name = esc_html( $category->cat_name ); $cat_link = esc_url( get_category_link( $category->term_id ) ); $cat_kana = esc_html( get_term_meta( $category->term_id, 'term_kana', true ) ); $cat_flg = get_term_meta( $category->term_id, 'osusume_flag', true ); if ( $cat_flg == 1 ) { $cat_class = ' class="osusume"'; } else { $cat_class = ''; } $html = '<li' . $cat_class . '><a href="' . $cat_link . '">'; $html .= '<ruby>'. $cat_name . '<rt>' . $cat_kana . '</rt></ruby>'; $html .= '</a></li>'; echo $html; endforeach; ?> </ul> フロント画面の実装方法 get_term_meta()で必要なものを取 得して整形
- 53. フロント画面の実装方法
- 55. さいごに