WordPressの投稿一覧からカスタムフィールドの絞り込み検索を追加するカスタマイズ。


WordPressの投稿一覧からカスタムフィールドの絞り込み検索を追加するカスタマイズ
WordPressでの更新が増えてくると、管理画面を使用する時間も長くなります。
すると「こういった機能があると便利なのにな〜」と思うことも増えてくるのではないでしょうか。

今回は一番使用する機会の多い「投稿一覧画面」に、カスタムフィールドの検索機能を追加する方法を紹介します。WordPressでは主にタイトルと本文しか入力することができませんが、
カスタムフィールドを設定するとそれ以外の項目を公開できるようになります。
何も設定していない投稿一覧画面は下図のようになっています。

タイトルや本文、日付、更にはカテゴリーから絞り込み検索を行うことができます。
タイトルや本文、日付、更にはカテゴリーから絞り込み検索を行うことができます

これでも十分に検索機能は充実しているのですが、カスタムフィールドの検索には対応していません
試しにカスタムフィールドに値を設定し、検索をしてみます。
「subtitle」というカスタムフィールドを作成し、「This is first post.」という値を設定しました。
subtitleというカスタムフィールドを作成しThis is first post.という値を設定しました
右上にキーワード検索があるので、そちらから検索を行った結果が下図になります。
「first post」をキーワードで検索してみましたが、”投稿は見つかりませんでした”となってしまいます。
投稿は見つかりませんでしたとなってしまいます

カスタムフィールドの値を検索できるようにする

ではこれから管理画面をカスタマイズして、カスタムフィールドの検索に対応できるようにします。

カスタマイズを行うにはfunctions.phpを編集します。
まず最初に検索したい内容を入力するフォームを表示させます。
“restrict_manage_posts”というフックを使用すると、カテゴリーの絞り込み検索の横に表示されます。
下記をfunctions.phpに追記します。

add_action('restrict_manage_posts', 'add_subtitle_filter');
function add_subtitle_filter(){
	global $post_type;
	//表示するのは投稿一覧画面のみ
	if ( $post_type == 'post' ) {
	  echo '<input type="text" name="subtitle" value="'. get_query_var('subtitle'). '" placeholder="subtitle" />';
	}
};

検索した内容はURLパラメータに追加されます。
その値を取得させるには”query_vars”というフックから配列に追加します。
これによって検索した内容がinputのvalueに入って、検索内容を確認できます。

add_filter('query_vars', 'add_subtitle');
function add_subtitle($vars) {
  $vars[] = 'subtitle';
  return $vars;
}

入力欄が表示されました。
入力欄が表示
では次に入力した内容が、カスタムフィールドの値から検索するようにします。
先ほどと同様にfunctions.phpへ下記を追記します。
記事の一覧を取得する時のフックである”posts_where”から、カスタムフィールドのsubtitleの内容を取得させます。
URLパラメータを見て”subtitle”がある場合は、検索のSQLにカスタムフィールド値の検索を行うようにします。

add_filter('posts_where', 'posts_where_subtitle');
function posts_where_subtitle($where) {
  global $wpdb;
  //管理画面でのみ実行
  if(is_admin()) {
  	$value = get_query_var('subtitle');
		if(!empty($value)) {
			//検索条件にカスタムフィールド「subtitle」の値を追加
			$where .= $wpdb->prepare(" AND EXISTS ( SELECT * FROM {$wpdb->postmeta} as m
				WHERE m.post_id = {$wpdb->posts}.ID AND m.meta_key = 'subtitle' AND m.meta_value like %s )",
				"%{$value}%" );
		}
	}
	return $where;
};

以上で、投稿一覧画面でカスタムフィールドの検索が可能になります。

カスタムフィールドの値をselectで検索できるようにする

カスタムフィールドの拡張プラグインである「Advanced Custom Fields」を使用した場合も、同様の結果になります。

デフォルトのカスタムフィールドではテキスト入力しかできませんが、Advanced Custom Fieldsは
チェックボックスやラジオボタンなど様々な入力形式にすることが可能です。
下図はチェックボックスで選択できるようにしたものになります。
チェックボックスで選択できるようにしたもの
カスタムフィールドの値が選択式になると、投稿一覧画面もテキスト入力ではなく選択式にした方が
いちいち文字を入力しなくてもマウスで選択できて便利です。

方法は簡単で、restrict_manage_postsをフックにして入力欄(input)を出力していた部分を
カスタムフィールドの値を選択するselectに変更します。

add_action('restrict_manage_posts', 'add_subtitle_filter');
function add_subtitle_filter(){
	global $post_type;
	//表示するのは投稿一覧画面のみ
	if ( $post_type == 'post' ) {
		echo '<select name="subtitle">';
		echo '<option value="">subtitleを選択</option>';
		foreach (get_field('subtitle') as $value) {
			$selected = "";
			if(get_query_var('subtitle') == $value) {
				$selected = ' selected="selected"';
			}
			echo '<option value="'. $value. '"'. $selected. '>'. $value. '</option>';
		}
	  echo '</select>';
	}
};

投稿一覧画面を見ると、subtitleをselectで選択できるようになっていることが分かります。
subtitleをselectで選択できるようになっている
いかがでしたでしょうか。
WordPressのユーザ画面のカスタマイズの記事は多いですが、管理画面のカスタマイズ記事はあまり多くありません。
プラグインで解決出来るものも多いですが、
処理の内容を把握できていないといざ別のことをやろうとしてもなかなか対応できません。

やっていることは簡単なものなので、是非管理画面のカスタマイズも色々試してみてください。