【Search & Filter】絞り込み検索でカテゴリーとタグを表示する方法!

(この記事は2021年11月28日に投稿されました。)

WordPressにはSearch & Filterという、シンプルな検索やフィルタリングができるプラグインがあります。

「Search & Filter」は普通の検索バーと違って、カテゴリーやタグなどを使用して複数条件での絞り込み検索ができるメリットがあります。

しかし、大体のテーマでは文字列を入力するタイプの検索バーが多いため、Search & Filterなどの複数条件の絞り込み検索まで準備していないケースが存在します。

そのため、Search & Filterを導入して絞り込み検索をしても、絞り込み検索はできているけど、タイトルが「カテゴリー名」のみでうまく表示されないということがあります。

今回はWordPressのSearch & Filterの絞り込み検索でカテゴリーとタグを表示する方法について紹介していきます。

この記事での内容はカテゴリーとタグを1つずつ選択し検索した場合について記載していますので注意してください。




Search & Filterとは

Search & Filterとは、WordPress用のシンプルな検索やフィルタリングができるプラグインとなります。

インストールをして設定することで、シンプルな検索バーを表示したり、カテゴリ、タグなど任意の組み合わせで複数条件の検索エリアを簡単に作成することができます。

もし、Search & Filterについて詳しく知りたい場合は下記の記事をご参考下さい。

Search & Filterの検索結果を表示するページはテーマによって変わる

Search & Filterなど、検索をかけて表示されるページはテーマによって変わります。

例えば、テーマ内にcategory.phpやtag.phpがなくて、archive.phpがある場合に、Search & Filterでカテゴリーとタグでフィルター検索をかけると、カテゴリーとタグで絞り込まれた記事の一覧が表示されますが、テンプレートとなって表示されるのはarchive.phpとなります。

また、テーマ内にarchive.phpがない場合に、Search & Filterでカテゴリーとタグでフィルター検索をかけると、テンプレートとなって表示されるのはcastegory.phpやtag.phpとなります。

下記の画像はsearch.phpがなく、archive.phpが存在しているテーマでSearch & Filterを使用した場合です。

通常のテーマのsearch&filterで絞り込み検索した結果

「スポーツ」のカテゴリーページが表示されており、このテーマには「category.php」や「tag.php」がないため、「archive.php」で表示されています。

なぜ、そうなるのかというと、WordPressには表示するPHPファイルに優先順位が決まっているテンプレート階層というものが存在しているからです。

例えば、「category.php」と「archive.php」がテーマ内に存在する場合にカテゴリーページを表示すると「category.php」を優先的に読み込んで表示するようになり、どちらも存在しない場合は「index.php」が読み込まれるようになります。

つまり、WordPressにはテンプレート階層というものが存在するため、Search & Filterなどで表示される検索結果のページはテーマで準備されているphpファイルによって異なるということです。

もし、WordPressのテンプレート階層について詳しく知りたい場合は下記の記事をご参考ください。

そのため、Search & Filterで文字列を入力して結果を表示したい場合は「search.php」を、カテゴリーとタグでフィルターをかけて検索したい場合は「archive.php」で結果を表示すればよいかと思います。

また、カテゴリーとタグの検索結果を別で分けたい場合は「category.php」と「tag.php」で結果を表示すればよいかと思います。

Sossy

WordPressには、「ページAがなかった代わりにページBを表示する」というように各ページにテンプレート階層があります。
そのため、どのようにテーマが作成されているかPHPファイルを確認しておきましょう。

Search & Filterの絞り込み検索でカテゴリーとタグを表示する方法

Search & Filterの絞り込み検索でカテゴリーとタグを表示する方法について紹介します。

方法としては下記の2通りの方法があるのですが、どちらも$_SERVER[‘REQUEST_URI’]を使用して取得したURIを基準に条件処理を行っています。

また、今回はカテゴリーとタグを1つずつ選択して検索する場合の方法となりますので、あくまで参考にしていただきましたら幸いです。

⚫︎ WordPress関数であるget_tag()を使用する
⚫︎ PHPのstrstr()を使用する

方法1: WordPress関数であるget_tag()を使用する方法

まず、1つ目はget_tag()を使用する方法です。

get_tag()はタグを取得するWordPress関数であり、引数にスラッグ名やIDを指定することで指定したタグを取得することができます。

試しにarchive.phpに使用してSearch & Filterで絞り込んだカテゴリーとタグを表示してみます。

■ archive.php

実行結果(カテゴリーとタグで絞って検索をかけた場合)

get_tags()でsearch&filterで絞り込み検索した結果-1

実行結果(カテゴリーのみとタグのみを絞って検索をかけた場合)

get_tags()でsearch&filterで絞り込み検索した結果-2
コードの簡単な解説
  1. まず、single_cat_title()関数を使用して表示されているカテゴリー名を表示している。
  2. そして、タグに関してはexplode()関数でページのURLを「/」で区切り、tagのスラッグ名のみを取り出してget_tags()で表示している。
  3. また、それだけだとカテゴリーやタグだけで絞っても表示されるので、strpos()関数でURLに「?tag=」と「category」が含まれる場合のみこの処理が行われるようになる。
  4. そうすることでURLのタグのスラッグ名をget_tags()の引数にしてタグ名が表示されるようになる。

Search & Filterでカテゴリーに「スポーツ」、タグに「個人」でフィルター検索をかけると、フィルターをかけた「スポーツ × 個人」で表示されています。

再び、Search & Filterでカテゴリーに「スポーツ」、タグに「集団」でフィルター検索をかけると、フィルターをかけた「スポーツ × 集団」で表示されています。

また、Search & Filterでカテゴリーに「スポーツ」、タグに「タグを選択」でフィルター検索をかけると、フィルターをかけた「スポーツ」で表示されています。

こちらも再び、Search & Filterでカテゴリーに「カテゴリーを選択」、タグに「ドキドキ」でフィルター検索をかけると、フィルターをかけた「ドキドキ」で表示されています。

そのため、Search & Filterでフィルターをかけたカテゴリーとタグで表示されていることがわかります。

Sossy

こちらの方法では、archive.phpにコード書くだけでフィルターをかけたカテゴリー名とタグ名を表示することができます。
しかし、コードの内容に関しては理解するまでに時間がかかるかと思います。

方法2: PHPのstrstr()を使用する方法

2つ目の方法はPHPのstrstr()でURIによって処理を分岐させる方法です。

strstr()関数は文字列を検索することができるPHPの関数になります。

こちらでも試しにarchive.phpに使用してSearch & Filterで絞り込んだカテゴリーとタグを表示してみます。

■ archive.php

実行結果(カテゴリーとタグを絞って検索をかけた場合)

strstr()でsearch&filterで絞り込み検索した結果-1

実行結果(カテゴリーのみとタグのみを絞って検索をかけた場合)

strstr()でsearch&filterで絞り込み検索した結果-2
コードの簡単な解説
  1. $_SERVER[‘REQUEST_URI’]でURIを取得し、strstr()で「URIに〇〇というタグのスラッグが表示される場合はスラッグ名に該当するタグ名を表示する」というようなパターンを作成している。
    (タグを全て書き出す必要がある。)
  2. そして、is_category()とis_tag()でカテゴリーページの場合はカテゴリーのみ、タグページの場合はタグのみを表示している。
  3. また、is_category()とis_tag()の両方の場合は、カテゴリーとタグを表示している。
  4. カテゴリーを表示する場合は「single_cat_title()」、タグを表示する場合は「single_tag_title()」を使用している。

Search & Filterでカテゴリーに「球技」、タグに「団体」でフィルター検索をかけると、フィルターをかけた「球技 × 団体」で表示されています。

再び、Search & Filterでカテゴリーに「陸上」、タグに「個人」でフィルター検索をかけると、フィルターをかけた「陸上 × 個人」で表示されています。

また、Search & Filterでカテゴリーに「体操」、タグに「タグを選択」でフィルター検索をかけると、フィルターをかけた「体操」で表示されています。

こちらも再び、Search & Filterでカテゴリーに「カテゴリーを選択」、タグに「個人」でフィルター検索をかけると、フィルターをかけた「個人」で表示されています。

そのため、Search & Filterでフィルターをかけたカテゴリーとタグで表示されていることがわかります。

Sossy

こちらの方法でもでフィルターをかけたカテゴリー名タグを表示することができますが、自分が登録しているタグ名とスラッグを記述する必要があります。
しかし、第3者の人が見ても見やすいコードとなっております。

まとめ

⚫︎ Search & Filterとは、WordPress用のシンプルな検索やフィルタリングができるプラグインである

⚫︎ Search & Filterなど、検索結果を表示するページはテーマによって変わる
(検索の結果を表示するphpのファイルには優先順がある)

⚫︎ Search & Filterで絞り込んだカテゴリーとタグを表示する方法は下記の2つの方法がある
・ WordPress関数であるget_tag()を使用する
・ PHPのstrstr()を使用する

2 COMMENTS

konsoup

はじめまして、こんにちは。
Search & Filterを導入し、カテゴリ×タグで検索をかけることには成功しましたが、検索結果ページでカテゴリ名しか表示されずハマっていたところでこちらのサイトに辿り着きました。まさにやりたいことだったので実装してみたのですが、どうしてもタグのところでエラーが出ます。

Undefined array key 0 in…

Attempt to read property “name” on null in

エラーです。

該当箇所のコードは
$tag_name = $tags_array[0] -> name;
です。

カテゴリ名は表示されています。

urlの表記は
https://aifer.jp/web-design-collection/category/book/?tag=design+cool+illustration

となっています。

php初心者なのでどうにも行き詰っております。
何かアドバイスいただけたら助かります。

返信する
Sossy

コメントありがとうございます。
方法1と方法2のどちらの方法でエラーが出ましたでしょうか?

返信する

コメントを残す

メールアドレスが公開されることはありません。