【サンプルファイル有】WordPressの絞り込み・複数検索を、カスタムフィールドで使って作った

どうも。カスタムフィールド製造業をしています。ユーヘー@katayamada_Yです

現在、不動産系のサイトを構築していまして、
そこでWPではめんどくさい絞り込み検索の機能をカスタムフィールドを使って作ってみました。

>[PR]【プログラミング不要!】2日でできるWordPress超入門~週末にワードプレスをインストールし、予約システムや、オンラインショップを作ろう! ~

これらは以下のプラグインでも可能です。金さえだせば。

  • FE Advanced Search(国産?高機能!高い!)
  • FacetWP(海外産!高機能!スマート!高い!)
  • WP Custom Fields Search(無料!新バージョンは未対応)
  • Search&Fillter(イチオシ!)

下に記事に他にも良いプラグインを3つ紹介してます。

関連記事
>初心者でもワンランク上のサイトが作れるWordPressのプラグイン

今回は予算に余裕はないので、自作することにしました。サンプルファイル用意してます。
WordPressの仕組みがいまいちわかってない方は、この本がオススメです。

検索フォームの基本的なコード

おかしくなってますが、下のサンプルファイル用意したので、ダウンロードしてみていただければと思います<(_ _)>

seearch.phpの方は、デフォルトを参考にしてもらったらいいと思うんですが、

こんな感じですね。

カスタムフィールドを使って検索してみよう

今回不動産なので、不動産のサンプルで作ってみました。

検索フォームのコード↓↓↓

search.phpのコード↓↓↓

カスタムフィールド
フィールド名:price
選択肢:(以下3行)
price_250 : ~250万円
price_500 : ~500万円
price_full : 上限なし(要相談)

今回、売却と賃貸は、カテゴリーで作ったので、カスタムフィールドではありません。

なので、search.phpの方では、meta_queryではなくcategoru__inに入れてます。
implodeってのは、配列を文字列に変換する関数で、配列だとarrayの中に入っているんですが、それを文字だけを取り出して

売却,賃貸

こんな感じで一列にしています。

カテゴリーを複数呼び出す場合は、catではなくcategory__inを使う

次に、WP_Queryの関数リファレンスを見てもらったらわかるんですが、catでは一個のカテゴリーしか取得できません。
なので、category__inを使っています。カテゴリー1つならcatでOK

ここ結構つまづくところですね。ちょう躓きました・・・・。

WP_Queryのmeta_queryを使えば、カスタムフィールドの値で呼び出すことができます。
↓↓↓

この部分ですね。
keyがカスタムフィールドのフィールド名です。
Valueには値を入れます。値はGETから引っ張ってきます。

compareのLIKEは「値で指定した文字列に一致する」ものを表示するために入れています。

ここ注意なんですが、かならずユニークな値を入れる必要があります。
他の値とかぶらないようにしましょう。キーワード検索とかならいんですけどね。

考え方としては、カスタムフィールドの値を変数に入れて、WP_Queryで呼び出すっていうそんだけです。

例えば、「売却、~250万円」で検索するとURLは
http://ドメイン名/?s=&sale[]=3&price[]=price_250
こうなります。
GETを使えば、&sale[]の値を取得することができ、それを変数にいれてWP_Queryで呼び出すってわけです。

意外と簡単でしょ。

ほんとは、カスタムフィールドの値一覧とかを呼び出してとかしたかったんですが、
意外と手間というか検索なんてそうそう変わらないので、直でいいかなーと思って直で書いてます。

まとめ


カスタムフィールドを使って絞り込み機能を実装することが出来れば作れるサイトの幅も広がります。
逆にこれ出来ないとちょっと辛い・・・。
それなりの規模のサイトであれば、当然のように絞り込み機能が必要になってきます。
覚えておいて損はないでしょう。

難しく考える必要はありません。URLから情報抜き出してQuery_postで呼び出しているだけです。
ただそれだけの事なんですが、ボクはこれがずっとできなかったんですよね。2年くらい前まで。

これを覚えれば不動産サイトなんて怖くない!!

しかし、もっと楽にできないもんかね・・・。まぁいいや。ではでは( ^ω^ )ノシ

サンプルファイル

上のコードコピペでもOKなはずなんですが、サンプルファイルを作りました。
サンプルファイル

おまけ:カテゴリーの絞り込み検索機能

カテゴリー内だけで検索したいってことは結構あります。
例えばブログの記事内から検索したいとかですね。

actionのの部分の後にカテゴリー名とか入れるとそのカテゴリーだけを検索する事が出来ます。

WordPressの仕組みがいまいちわかってない方は、この本がオススメです。

赤ヒツジ先生~コーディングチェック~

このサービスは、コーディングのHTMLチェックではなく、デザイン通りにコーディングできているかをチェックするサービスです。