アドベントカレンダー参加中！
この記事は「Vektor WordPress Solution Advent Calendar 2025」の12月13日の記事になります。
はい、いしかわでございます。昨日の「Lightning G3 Pro 版のデモサイトが VK フルサイトインストーラー からインストール可能になりました！」に続いての記事になりますが、今回はこのデモサイトに無料プラグイン VK Filter Search を使って絞り込み検索を設置する方法を動画と解説記事で紹介します。
「動画見るのはかったるいよ」って方は、倍速で見たり、動画は飛ばして記事の方だけ確認してもらえればと思います。
記事の後半に大事な補足事項がありますので「VK Filter Search だいたい知ってるよ」という方も最後だけでも確認しておいてください。
絞り込み検索フォームの設置
プラグイン VK Filter Search をインストール
WordPress公式プラグインに登録してあるプラグインですので、無料でインストール可能です。
投稿タイプ「VK Filter Search」に VK Filter Search ブロックを配置・設定する
VK Filter Search は絞り込み検索を配置したいページに直接 VK Filter Search ブロックを配置するのではなく、投稿タイプ「VK Filter Search」に一旦登録します。
これは、
- 複数箇所で同じ検索フォームを配置しやすくなる
- VK Filter Search ブロックの外側の要素も含めて複数箇所に呼び出せるようになる
という理由でこの仕様になっています。
絞り込み検索の対象を設定します
VK Filter Search ブロックから、絞り込み対象の投稿タイプなどを指定します。
絞り込み検索を表示したい場所に Call Filter Search ブロックを配置
例えばトップページに絞り込み検索フォームを配置したい場合は、トップページに指定している固定ページに、Call Filter Search ブロックを配置します。
その上で、どの絞り込み検索フォームを表示するのかサイドバーから選択してください。
検索結果ページの設定
検索結果ページは、通常テーマの検索結果ページのレイアウトに依存しますが、VK Filter Search のバージョン 2.18 からはブロックエディタで自由にレイアウトできるようになっています。
検索結果画面用の固定ページを作成
まずは検索結果画面として使用する固定ページを作成します。
Search Result Form ブロックとクエリーループブロックを配置して「カスタムに設定」
クエリーループブロックのクエリータイプは「カスタム」に設定してください。
その他の設定項目の多くは検索条件で上書きされます。
クエリーループブロックのクエリータイプを「デフォルト」に設定すると検索結果が反映されませんので注意してください。
クエリーループの中のレイアウトはブロックエディタですので、お好みに応じてレイアウトを変更してください。
VK Filter Search ブロックから検索結果ページとして使用する固定ページを指定
作成済みの検索フォームの編集画面を開き直して、「検索結果ページ」で前のステップで作成したページを選択してください。
固定ページで検索結果ページを作った場合の注意事項
固定ページの順序を下げておく
プラグイン Simple Page Ordering など、ページの並び替えプラグインを使って表示順序を下げておいてください。
でないと…
HTMLサイトマップページなどで変な順番で表示されてしまいます！
そもそも検索結果ページが表に出ないよにしておく
プラグイン VK All in One Expansion Unit をご利用の方は、ExUnit のHTMLサイトマップに出力されないようにしておくのと、検索にひっかからないように noindex 設定にチェックを入れておきましょう。
是非使ってみてください！
アドベントカレンダーへのご参加をお待ちしております！
明日はベクトルスタッフのとりさんによる「時短に効く！WorePress ブロックエディターのコツまとめ」です。
みなさまのご参加を心よりお待ちしております！
この記事を書いた人
- 代表取締役
-
名古屋のウェブ制作会社数社に10年程度務めた後、株式会社ベクトル設立。
企画・運営・コンサルティング〜WordPressを中心としたシステム開発まで幅広く携わる。
[ 著書 ]
・いちばんやさしいWordPressの教本（共著）
・現場でかならず使われているWordPressデザインのメソッド（共著）
[ 最近のWordPressコミュニティでの活動 ]
WordCamp Tokoy 2023 セッションスピーカー
WordCamp Asia 2023 セッションスピーカー（LT）
WordCamp Niigata 2019 セッションスピーカー
WordCamp Haneda 2019 セッションスピーカー
WordCamp Osaka 2018 セッションスピーカー
WordCamp Kyoto 2017 セッションスピーカー
他
を購入して
特典をゲットしよう！
特典A
X-T9 工務店
（ ナチュラル ）
19,800円 (税込)
0円に！
特典B
Lightning ビジネス（Evergreen）
9,900円 (税込)
0円に！
特典C
Lightning 工務店
（ ナチュラル ）
19,800円 (税込)
0円に！
今なら！
Vektor Passport の
有効期間中、上記の
デモサイトデータを
何度でも素早くまるごと
インポートできます！
爆速!!１分でデモサイトと同じ
ホームページができる
選んだデモサイトと同じ状態の WordPress サイトを、わずか数ステップで再現できるインポート専用プラグインです。数クリックで、プロ品質のサイトがすぐに起動します。
フルサイト編集対応ブロックテーマ
WordPress テーマ X-T9 は、WordPress 5.9 から実装されたフルサイト編集機能に対応した「ブロックテーマ」と呼ばれる新しい形式のテーマです。
ヘッダーやフッターなど、今までのテーマではカスタマイズが難しかったエリアもノーコードで簡単・柔軟にカスタマイズする事ができます。
パターンを使って
よりクオリティの高いサイトに
パターンとは、WordPressのブロックを組み合わせて作ったデザインテンプレートのようなもの。プロのデザイナーが制作したパターンを300以上公開中！コピペしながら高品質なサイトを簡単に作れます。
ブロックエディターで
ABテストを
自由に作成できる
VK AB Testing は、ABテストを実施するための WordPress 用プラグインです。ブロックエディターでテストパターンを自由に作成でき、ランダム表示とクリック計測が可能です。Webサイトや広告などの施策の改善にぜひご活用ください。