🏡まったのブログ

【WordPress】絞り込み検索をプラグインなしで実装する方法(備忘録)

Wordpressにおける絞り込み検索の実装では ・Advanced Custom Fields(ACF) ・Search & Filter Pro の組み合わせが個人的におすすめですが、Pro版は年間$20かかるので、PHPで実装することがあります。 いつもKOTORIさんのブログを参考にするのですが、それでもよく分からなくなるので、個人的に『カスタムフィールド で絞り込み検索をしたい場合』のみに特化してまとめます。

結論

  • Advanced Custom Fieldの出力は特殊なのでCustom Field Tempate(CFT)を使うべし
  • カテゴリ検索以外はmeta_queryに追加するべし
  • 検索フォーム側のvalue=""の言葉で検索できる(labelや値(priceやtrueなど)ではうまく検索できず)
  • 検索フォーム側はクエリを連結して投げるだけ、絞り込み処理は検索結果一覧(search.phpやindex.php)に書く
  • wp_reset_query();を忘れないように

ポイント

細かな説明は省きますが、ポイントをいくつか列挙します。

なぜACFでなくCFTを使うのか

ACFで作成したカスタムフィールドはDBへの登録が特殊なようで、うまく絞り込みできません(何をkeyにしていいか分からなかった)。その特殊性ゆえにget_field('price');のように書くだけで、カスタムフィールドの値を取得できたりするのですが、Search & Filter Proと組み合わせない限り、CFTを使用した方が確実です(今回は検索フォーム側に選択肢を直に書いていますが、ACFの独自関数などを使えば、ACFで増やした選択肢が検索フォームにも自動反映されるとかもできそうではありました)。

カスタムフィールドの検索は基本meta_queryに追加しとけ

カテゴリ検索はtax_queryを使いますが、カスタムフィールド はチェックボックスも範囲選択もドロップダウン(<select></select>)も、すべてmeta_queryに追加でいけます。

標準のキーワード検索フォームの機能を損なわないように注意

検索フォームのキーワード検索を利用すれば、URLにhoge.com/?s="りんご"&low_price="300円"...のようにクエリがつきますが、WordPress標準の検索フォームで検索すると/?s="りんご"しかクエリがつきません。 なので、検索結果一覧側(search.phpやindex.php)で、クエリでpriceなどが付いてない時もキーワード検索できるようにしないといけません(ちょっと説明しづらい)。

$low = $_GET['low']; $high = $_GET['high']; if($low || $high) { // ←ここでどっちかのクエリが存在している時だけmetaquerysp[]に追加する if(!($low == 0 && $high == 9999999)) { $metaquerysp[] = array( 'key'=>'my_price', 'value'=>array( $low, $high ), 'compare'=>'BETWEEN', 'type'=>'NUMERIC', ); } }

また価格帯で絞る時など、初期値が「下限なし」〜「上限なし」のようになっていると、その下限なし/上限なしのvalueがクエリとして渡されてしまうので、その場合もmetaquerysp[]に値が追加されないようにしないといけません。
$low = $_GET['low']; $high = $_GET['high']; if($low || $high) { if(!($low == 0 && $high == 9999999)) { // ←ここで、初期値の「下限なし」「上限なし」の場合はmetaquerysp[]に値を追加しないようにしている $metaquerysp[] = array( 'key'=>'my_price', 'value'=>array( $low, $high ), 'compare'=>'BETWEEN', 'type'=>'NUMERIC', ); } }

その他、作業するにあたっての注意

コーディングは関係ないですが、業務としての注意点として、絞り込み検索は ・どの場所に(サイドバー、トップ、検索結果、固定ページ、投稿記事) ・どんなタイプの検索項目を ・それぞれ何の選択肢で ・範囲指定の場合の単位(刻み幅)はいくつで ・いくつの項目を実装するのか ・モバイルの表示位置は? ・ヘッダーなどにある標準の検索フォームは非表示にする? ・AMP対応ページでも動かすのか ・サイドバーが標準でないテーマではないか など、事前に検討すべき点が多いです。 またPHPによる実装だと、原則最初に決めた項目・順番・選択肢は後から変更不可ですが、クライアント様側では初めに項目や選択肢が決まってない/ぼんやりしていることが多いので、要件を詰めたり、それぞれで実装する段階に予想以上の工数がかかります。このあたりをしっかり踏まえた上で仕事にあたるべきです。 そう考えると素直にSearch & Filter Proをおすすめするのが、双方にとって負担が楽で一番いいかなぁという考えに至っています。

サンプルコード

キーワード検索、チェックボックス、ドロップダウン、価格帯で絞る場合のサンプルコードです。KOTORIブログさんのコードほぼそのままですが、if文の追加や改行などを私なりにアレンジしてます。