WordPressの検索フォームをカスタマイズしよう
WordPressの検索フォームはキーワードを入力するテキストボックスと、検索を実行する検索ボタンで構成されています。
この検索フォームにカスタムタクソノミーを指定する方法をご紹介します。
検索条件にカスタムタクソノミーを追加しよう
以下の順序で検索フォームをカスタマイズしていきます。
- searchform.php をテーマフォルダに追加
searchform.php にカスタムタクソノミー選択用のセレクトボックスを設置
検索ボックスを呼び出し
1.searchform.php をテーマフォルダに追加しよう
まずやることは、searchform.phpというファイルをテーマフォルダ内に追加することから始めます。
中身は取り敢えず空で大丈夫です。
2.searchform.php にカスタムタクソノミー選択用のセレクトボックスを設置
searchform.php をエディタで開いて以下のように書き換えます。
タクソノミースラッグ（以下例だとpref）をご自身のサイトに付け加えてあげてください。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | <?php /* * 検索ボックスのカスタマイズ * カスタムタクソノミーを検索条件に追加する */ <form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>"> <label> <span class="screen-reader-text">検索キーワード</span> <input type="search" class="search-field" placeholder="キーワードを入力" value="<?php echo get_search_query() ?>" name="s" /> </label> <label> <span class="screen-reader-text">都道府県で絞り込み</span> <?php $selected = get_query_var("pref",0); $args = array( 'show_option_all' => '都道府県で絞り込み', 'taxonomy' => 'pref', 'name' => 'pref', 'value_field' => 'slug', 'hide_empty' => 1, 'selected' => $selected ); wp_dropdown_categories($args); ?> </label> <input type="submit" class="search-submit" value="検索" /> </form> |
2-1. カスタムタクソノミーを複数設置したい場合
以下部分をコピーして、formタグ内に追加することで、複数のカスタムタクソノミーからのAND条件検索も行えます。
●●●・・・タクソノミーラベル（例：都道府県）
■■■・・・タクソノミーの名前[半角英数]（例：pref）
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <label> <span class="screen-reader-text">●●●で絞り込み</span> <?php $selected = get_query_var("■■■",0); // 選択状態となるタクソノミースラッグを取得 $args = array( 'show_option_all' => '●●●で絞り込み', // 何も指定しない場合のラベル（要らなければこの行削除してOK） 'taxonomy' => '■■■', // タクソノミーの名前 'name' => '■■■', // タクソノミーの名前 'value_field' => 'slug', // タクソノミーのスラッグをセレクトボックスのオプションに設定する 'hide_empty' => 1, // 空のタクソノミーは非表示(0にすると表示) 'selected' => $selected ); wp_dropdown_categories($args); ?> </label> |
3. カスタマイズした検索ボックスを呼び出し
検索ボックスを表示させたい箇所のテンプレート（sidebar.php等）に以下のコードを記載します。
1 | <?php get_search_form(); ?> |
これでカスタマイズした検索ボックスが表示されるはずです。
CSSの調整等はよしなにしてくださいませ。
まとめ
結構簡単に検索条件にタクソノミーを追加できた！
その他にも、特定の日付範囲内の記事を検索する。とかもやろうと思えば出来ます。その場合、上記以外にも修正が必要です。それはまた気が向いたら追記しようかな。
