複合検索のためのフォームを実装する

検索フォームはHTMLで自由に作れるので、検索したい項目を作成すればOK。

ここでは、検索キーワード、カテゴリ、カラーというカスタムフィールドを検索する。

nameに入れる文字はクエリの作成で使うのでわかりやすい文字を入れておく。

フォームは、search-form.phpのようなテンプレートとして作って、サイドバーなど好きなところから呼び出す。

// search-form.php
<form method="get" id="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
	<label for="s">キーワード</label>
	<input type="text" class="field" name="s" id="s" placeholder="検索キーワード" />
	<label for="category">カテゴリ</label>
	<select name="category" id="category">
		<?php 
			$cateogry_list = get_terms( array(
				'taxonomy' => 'category',
			) );
			foreach( $cateogry_list as $category ) {
				if( $category->parent == 0 ) {
						echo '<option value="'. esc_attr( $category->term_id ) .'">
										'. esc_html( $category->name ) .'</option>';
				}
			}
		?>
	</select>
	<label for="s">カラー</label>
	<select name="color" id="color">
		<option value="red">Red</option>
		<option value="blue">Blue</option>
		<option value="yellow">Yellow</option>
	</select>
	<input type="submit" class="submit" value="検索" />
</form>

複合検索の表示方法

検索結果を表示するには、WP_Queryにクエリを渡すだけ。

クエリを作るために必要な検索キーワードや選択項目を取得するには$_GET['name']を使う。

nameの部分にはフォームのname属性に入れた文字を入れる。nameがsなら$_GET['s']となる。

// search.php
<?php
$args = array(
  's' =>  $_GET['s'], // 検索ワード
  'cat' => $_GET['category'], // カテゴリID
  'meta_query'  =>  array(
    array(
      'key'     => 'color', // メタキー
      'value'   => $_GET['color'], // 値
    ),
  )
);
$wp_query = new WP_Query( $args ); ?>

<?php 
if ( $wp_query->have_posts() ) : 

  /* Start the Loop */
  while ( $wp_query->have_posts() ) :
    $wp_query->the_post();

    // 投稿内容を表示

  endwhile;

    // ループ終了後の処理、ページネーション表示など
    the_posts_navigation();

else :

  // 投稿がない場合の表示

endif;
?>

検索結果の表示はpre_get_postsを使う方法もあるのでどちらか好きな方で実装する。