WordPressの管理画面、投稿一覧の表にカスタムフィールドを表示する方法
カテゴリ：WEB制作
WordPressの管理画面の投稿一覧に表示される項目は、タイトルや公開日時の他にカテゴリー、タグ、コメント、投稿者になります。カスタムフィールドに登録された項目は表示されません。
場合によってはカスタムフィールドを見れた方がいいケースがあります。
例えば物件情報を掲載する場合などはマンションなのか戸建てなのか、賃貸なのか売買なのかなどが一覧から見れると便利でしょう。
そこで今回は『Wordpressの管理画面、投稿一覧の表にカスタムフィールドを表示する方法』を紹介します。
以下の上の段がビフォー、下の段がアフターです。
コードの紹介
// 管理画面に追加するカスタムフィールドを指定する配列
define('CUSTOM_POST_TYPES', array('post' , 'shop')); // 対象にするポスト名
define('CUSTOM_FIELDS', array('prefecture', 'city', 'tel' )); // 表示したいカスタムフィールド
/**
* ACFフィールドのタイプが日付かどうかを確認し、必要に応じてフォーマットする関数
*/
function format_custom_field_value_acf($field_name, $value) {
// ACFがインストールされている場合のみ処理を行う
if (function_exists('get_field_object')) {
// フィールドオブジェクトを取得
$field = get_field_object($field_name);
// フィールドが存在し、タイプが日付（date_picker）であればフォーマットする
if ($field && $field['type'] === 'date_picker') {
// 日付形式を確認してフォーマット
$date = DateTime::createFromFormat('Ymd', $value);
return $date ? $date->format('Y/m/d') : $value; // フォーマットできなかった場合はそのまま返す
}
}
// ACFのフィールドではない場合や、日付フィールドでない場合はそのままの値を返す
return $value;
}
/**
* 管理画面の投稿一覧にカスタムカラムを追加する
*/
function add_custom_columns_to_admin($columns) {
// 定数からカスタムフィールドを取得
foreach (CUSTOM_FIELDS as $field) {
$columns[$field] = ucwords(str_replace('_', ' ', get_field_object($field)['label'] )); // フィールド名をタイトルケースに変換して追加、フィールド名からラベルを取得します。
}
return $columns;
}
/**
* カスタムカラムにデータを表示する
*/
function display_custom_column_data($column_name, $post_id) {
global $custom_fields;
// カスタムフィールドの値を取得して表示
if (in_array($column_name, CUSTOM_FIELDS)) {
$value = get_post_meta($post_id, $column_name, true); // カスタムフィールドの値を取得
echo esc_html(format_custom_field_value_acf($column_name, $value)); // ACFフィールドを考慮してフォーマットして表示
}
}
/**
* 管理画面の投稿一覧にカラムを追加するフック
*/
function setup_custom_columns_for_post_types() {
// 定数からポストタイプを取得
foreach (CUSTOM_POST_TYPES as $post_type) {
// カラムを追加するフック
add_filter("manage_{$post_type}_posts_columns", 'add_custom_columns_to_admin');
// カラムにデータを表示するフック
add_action("manage_{$post_type}_posts_custom_column", 'display_custom_column_data', 10, 2);
}
}
add_action('admin_init', 'setup_custom_columns_for_post_types');
コードの解説
functions.phpにコードを追加していきます。
まず冒頭に対象となる投稿ポスト名、カスタムフィールド名を入力します。
define('CUSTOM_POST_TYPES', array('post' , 'shop')); // 対象にするポスト名
define('CUSTOM_FIELDS', array('prefecture', 'city', 'tel' )); // 表示したいカスタムフィールド
Advanced Custom Fieldを使用している場合、日付選択にdate_pickerを使用する場合もあるのでその場合は日付のフォーマットを整える関数を作成します。Advanced Custom Fieldを使用していない場合はそのまま値を返します。
function format_custom_field_value_acf($field_name, $value) {
// ACFがインストールされている場合のみ処理を行う
if (function_exists('get_field_object')) {
// フィールドオブジェクトを取得
$field = get_field_object($field_name);
// フィールドが存在し、タイプが日付（date_picker）であればフォーマットする
if ($field && $field['type'] === 'date_picker') {
// 日付形式を確認してフォーマット
$date = DateTime::createFromFormat('Ymd', $value);
return $date ? $date->format('Y/m/d') : $value; // フォーマットできなかった場合はそのまま返す
}
}
// ACFのフィールドではない場合や、日付フィールドでない場合はそのままの値を返す
return $value;
}
投稿一覧の見出しのカラムにラベルを追加します。
Advanced Custom Fieldを例にするとフィールド名がprefectureとした場合、都道府県で登録している場合が多いですが、この『都道府県』を表の見出しにセットする必要があるため、フィールドからラベルを取得します。
function add_custom_columns_to_admin($columns) {
// 定数からカスタムフィールドを取得
foreach (CUSTOM_FIELDS as $field) {
$columns[$field] = ucwords(str_replace('_', ' ', get_field_object($field)['label'] )); // フィールド名をタイトルケースに変換して追加、フィールド名からラベルを取得します。
}
return $columns;
}
次に値を設定していきます。
『get_post_meta』でカスタムフィールドの値をセット、冒頭で設定したAdvanced Custom Fieldの日付フィールドフォーマットを通過して出力しています。
function display_custom_column_data($column_name, $post_id) {
global $custom_fields;
// カスタムフィールドの値を取得して表示
if (in_array($column_name, CUSTOM_FIELDS)) {
$value = get_post_meta($post_id, $column_name, true); // カスタムフィールドの値を取得
echo esc_html(format_custom_field_value_acf($column_name, $value)); // ACFフィールドを考慮してフォーマットして表示
}
}
最後に一覧画面に追加するためにフックを設定します。
function setup_custom_columns_for_post_types() {
// 定数からポストタイプを取得
foreach (CUSTOM_POST_TYPES as $post_type) {
// カラムを追加するフック
add_filter("manage_{$post_type}_posts_columns", 'add_custom_columns_to_admin');
// カラムにデータを表示するフック
add_action("manage_{$post_type}_posts_custom_column", 'display_custom_column_data', 10, 2);
}
}
add_action('admin_init', 'setup_custom_columns_for_post_types');
まとめ
以上、『Wordpressの管理画面、投稿一覧の表にカスタムフィールドを表示する方法』でした。
要件として求められることが多いので押さえておくと便利でしょう。
