ワードプレスでタグやカテゴリで絞り込み→フィルター機能を実装する方法




ワードプレスの記事数が多くなってきたときに
複数のタグやカテゴリーで記事を絞り込み【フィルタリング】できたらなー
って思うことありませんか?

ワードプレスであればプラグインを使えば
簡単に実装できます。

これが出来ると
映画のレビューまとめサイトとか
応用してできる事がめっちゃ拡がって
ワクワクする事この上ないですね。

phpなどの知識不要
使うプラグインと
ショートコードの設置ができればOK。

使うプラグイン
【Custom Taxonomy Order】
【Custom Post Type UI】
【Search & Filter】

の3つです。

もしかしたら他にもっと効率よい方法あるかもですが
あったら僕も知りたいので教えてください!

Custom Post Type UIを追加してカスタムタクソノミーを作成する

プラグインの新規追加→有効化
なんて説明不要ですよね。

【Custom Post Type UI】

で検索して。追加。

プラグインの機能を利用して
カスタムタクソノミーを作成します。

タクソノミーってなんか
鼻くそのみ
って響きで間抜けなんですけど

要するに
カテゴリとかタグとかエントリーに紐付けるタグですね。


自分でオリジナルで作るタクソノミーをカスタムタクソノミーって言います。

例えば
都道府県
市町村

とか

価格
年齢
とか・・・

出来ること広がりますね。

Custom Taxonomy Order

このプラグインで
カテゴリーやタグ
カスタムタクソノミーの
表示する順番を指定できます。

他にも同じようなプラグインいろいろとありますので
競合してうまくいかない場合は他もためそう

プラグインSearch & Filterを追加

Search & Filterを追加します。

ショートコードで表示します。

ショートコードをを調整することでいろんな表示の仕方ができます。

例えば
ラジオボタンなのかチェックボックスか
ドロップダウンか
投稿数を表示するのか
投稿が入ってないカテゴリを表示するのかどうか

などなど

細かくは

また別記事に上げます。

こちらを参考に

https://docs.designsandcode.com/search-filter/#examples

▼投稿ページ,ウィジットなど
[searchandfilter fields=”age,price” submit_label=”探す” headings=”年齢から選ぶ,価格から選ぶ”] とすると
こんな風に表示される

▼サイドバー
こっちも参考に

まとめ

ワードプレスで出来ることが大幅に広がると思いますので
いろいろと試してみてください。

プラグインを有効活用することで
車輪の再発明を回避できますね。

参考URL

解決しなかった方は
この辺のサイトもみてみてください。

https://yosiakatsuki.net/blog/get-posts-tag/
https://works.coldsleep.jp/blog/narrowing-down/
https://www.akaeho.net/wp-searchform/
https://docs.designsandcode.com/search-filter/#examples
https://blog.cntlog.net/archives/2675

参考キーワード

このページで解決しなかった方
以下のキーワードもグーグルで検索してみて。
スマホならタップ長押しで検索できるはず。

カスタムタクソノミー
Custom Post Type UI
Search & Filter
ワードプレス フィルター ソート
ワードプレス タグ ソート