VK Filter Search


VK Filter Search

無料

公式ディレクトリ掲載

ブロックエディター対応

ブロックテーマ対応

有効インストール 5,000 突破

VK Filter Search は、 カテゴリー、タグ、カスタム投稿タイプ、キーワードなどで絞り込める検索機能を、ブロックとして追加するプラグインです。ブロックエディターを使用して簡単に絞り込み検索フォームを作成できます。
WordPressの公式ディレクトリに掲載されていますので、ご自身の管理画面のプラグイン追加からインストールして無料で利用できます。

WordPress.com でホストされているサイトをご利用の方への注意事項(クリックで開く)

【WordPress.com でホストされているサイトをご利用の方への注意事項】

WordPress.com でホストされているサイトではJetpackが無効化できないため、VK Filter Serch を利用する前に以下の「画像アクセラレーター」と「検索」の設定をオフにしてください。オンになっていると、検索結果が正常に動作しなくなる可能性が高いです。

Pro版 VK Filter Search Pro もございます

より高度な絞り込み検索フォームを必要とする場合は、有料プラグイン「VK Filter Search Pro」をご検討ください。不動産サイトの物件検索で見かけるような高度な絞り込み検索フォームを作成できます。買い切りのライセンスで複数のサイトでご利用いただけます

VK Filter Search のインストール

VK Filter Search は WordPress 公式ディレクトリに登録済みです。ご利用の WordPress の管理画面にて、 プラグインの追加から検索してインストール・有効化してください。

VK Filter Search の構成

投稿タイプ VK Filter Search

VK Filter Search を有効化すると、ダッシュボードに投稿タイプ「VK Filter Search」が追加されます。この投稿タイプを利用して検索フォームを作成・登録します。

投稿タイプ VK Filter Search について

投稿タイプ「VK Filter Search」はバージョン2.0.0から追加されました。2.0.0 以前に、従来の方法で直接配置していた検索フォームには影響いたしませんので、ご安心ください。

変更の背景など、詳しくはこちらよりご確認ください。

VK Filter Search で追加されるブロック

また、ブロックインサーターには、以下の4つのブロックが追加されます。

  • VK Filter Search
  • Call Filter Search
  • Search Result Form
  • Search Result Title

各ブロックの詳細は、以下よりご確認ください。

VK Filter Search の使い方

STEP

検索フォームを登録する

専用投稿タイプに VK Filter Search ブロックを配置して検索フォームを作成し、登録します。

STEP

検索フォームを呼び出す

ページに Call Filter Search ブロックを配置して、作成したフォームを呼び出します。

STEP

ブロック・機能の説明

各ブロックや機能の説明はこちらからご覧ください。

検索フォームを登録する

ダッシュボードの VK Filter Search から新規追加をクリック

STEP
1

VK Filter Search ブロックを挿入し、検索フォームを作成

VK Filter Search ブロックを挿入します。

対象の投稿タイプを指定して、検索フォームを作成します。各ブロックや機能の詳細は、以下よりご確認ください。

検索フォームの装飾方法

WordPress 標準のグループブロックなどを利用すれば、背景色や枠線など検索フォームを装飾できます。必要に応じて調整してください。

装飾とテキストを追加した例

上下方向のマージンを指定

親の VK Filter Search ブロックを選択した状態で、設定サイドバーの「スタイル」から指定できます。ブロックの下につく余白を無くしたい時や調整したい時にご利用ください。

※ ご利用のテーマによります。ブロックテーマ X-T9theme.json が有効な Lightning であれば指定できます。

  • この検索フォームを検索結果ページでも表示する:必要に応じてONにする
  • 投稿タイプアーカイブへの表示:必要に応じて該当の投稿タイプにチェックを入れる

ここの設定項目について詳しくは、以下よりご確認ください。

ブロックテーマの場合

X-T9 などのブロックテーマで、検索結果ページやアーカイブページに検索フォームを表示させるには、Search Result Form ブロックの設置が必要です。

STEP
2

検索フォームを公開する

「公開」をクリックします。

STEP
3

登録した検索フォームを呼び出す

Call Filter Search Form ブロックを挿入する

固定ページなど検索フォームを呼び出したいところに、Call Filter Search Form ブロックを挿入します。

STEP
1

検索フォームを指定する

右側の設定サイドバーから、登録した検索フォームを指定します。

STEP
2

ページを公開する

ページを公開します。

STEP
3

検索フォームの動作を確認する

絞り込み検索フォームの動作を確認します。

STEP
4

検索結果の表示を確認する

検索結果の表示を確認します。

VK Filter Search では、フォームが登録された投稿IDを自動的に確認するため、検索結果ページでもその投稿を表示します。また、検索結果がなくても、検索結果ページが表示されるようにしています。

なお、検索結果にも検索フォームを表示するように設定している場合は、以下のように表示されます。

STEP
5

VK Filter Search のブロック・機能

ブロックインサーターには、以下の4つのブロックが追加されます。

VK Filter Search で追加されるブロック
  • VK Filter Search:検索フォームを作成するブロック
  • Call Filter Search:登録した検索フォームを呼び出すためのブロック
  • Search Result Form:X-T9などのブロックテーマで検索結果ページに検索フォームを表示させるためのブロック*
  • Search Result Title:検索結果ページで検索条件を文字列で表示するためのブロック

* Search Result Form はブロックテーマ向けです。Lightning などクラシックテーマでは不要です。

VK Filter Search ブロック

VK Filter Search ブロックは、検索フォームの親となるブロックです。VK Filter Search ブロックを挿入すると、インナーブロックとして3つのブロックが自動セットされます。3つのブロックは、親のVK Filter Searchブロック内でのみ利用できます。

  • VK Filter Search ブロック
    • VK Taxonomy Search(VK タクソノミー検索ブロック)
    • VK Taxonomy Search(VK タクソノミー検索ブロック)
    • VK Keyword Search (VK キーワード検索ブロック)

また、以下のインナーブロックも追加して利用できます。

  • VK Post Type Search(VK 投稿タイプ検索ブロック)

※インナーブロックは、親のブロック内でのみ利用できます。

インナーブロックは追加や削除、並び替えが可能です。

VK Filter Search ブロックの設定項目

  • 対象投稿タイプ:プルダウンから、絞り込み対象の投稿タイプ(投稿・固定ページ・カスタム投稿)を指定します
  • この検索フォームを検索結果ページでも表示する:ONにすると、検索結果ページにも検索フォームが表示されます
  • 投稿タイプアーカイブへの表示:チェックを入れた投稿タイプのアーカイブページに検索フォームが表示されます

投稿タイプアーカイブへの表示

チェックを入れると、投稿タイプのアーカイブページではこのように検索フォームが表示されます。

インナーブロック:VK Taxonomy Search(カテゴリー)

「タクソノミー設定」にて、カテゴリ・タグ・カスタム分類などのタクソノミーを指定できます。

インナーブロック:VK Taxonomy Search(タグ)

同様に「タクソノミー設定」にて、カテゴリ・タグ・カスタム分類などのタクソノミーを指定できます。

インナーブロック:VK Keyword Search(キーワード)

キーワード用のテキストフォームが生成されます。VK Keyword Search には設定項目はありません。

インナーブロック:VK Post Type Search (投稿タイプ)

VK Post Type Search ブロックは、検索に含める投稿タイプを選択できます。カスタム投稿タイプがある場合は、ここに表示されます。

Call Filter Search ブロック

登録した検索フォームを呼び出すためのブロックです。くわしくは以下よりご確認ください。

Search Result Form ブロック

X-T9 などのブロックテーマで利用します。Lightning などのクラシックテーマではこのブロックは不要です。

ブロックテーマの場合、検索結果ページやアーカイブページに検索フォームを表示させるには、検索テンプレートや投稿タイプアーカイブテンプレートに、Search Result Form ブロックの設置が必要です。

例)検索テンプレート

必要に応じて、赤字のアラートメッセージに従って設定してください。

なお、サイト編集の「テンプレート」で、まだ「アーカイブ」や「検索」のテンプレートが存在していない場合は、右上の「新規追加」から追加できます。

Search Result Title ブロック

フルサイト編集向けのブロックで、検索結果ページに検索条件を文字列で表示できます。

カスタムフィールドには対応していませんので、カスタムフィールド検索(Pro版のみ)の検索条件は表示されません。

たとえばブロックテーマ X-T9 を利用していて、以下のようにページタイトル「検索結果」の下に検索した際の検索条件を表示させたいとします。

検索結果テンプレートの編集画面を開いて、Search Result Title ブロックを挿入します。デフォルトでは、以下のようなダミーの内容が編集画面上に表示されます。

VK Blocks の場合
VK Blocks Pro の場合

設定サイドバーのパネル「検索タイトルオプション」では、表示させたい文字列の変更などができます。

X-T9 の検索結果テンプレートにSearch Result Title を配置
  • HTML要素:出力するHTML要素を Default(div)、h1、h2 から選べます。
  • 検索結果タイトルの表示形式:デフォルトの検索結果ではなく検索条件:など、ほかの文字列に変更できます。
  • クエリタイトルの表示:投稿タイプ名やタクソノミー名の表示・非表示ができます。(下記画像を参照)
  • クエリタイトルの後の文字列:ほかの文字列に変更できます。
クエリタイトル表示
クエリタイトル非表示
  • クエリ要素の前(後)の文字列:ほかの文字列に変更できます。
  • クエリ要素の後のセパレーター文字列:ほかの文字列に変更できます。
VK Filter Serch Pro の場合
VK Filter Serch Pro の場合

Pro版 拡張機能との比較

VK Filter Search Pro版 は買い切り型のプラグインです。1度のご購入で複数のサイトにご活用いただけます。

絞り込み検索プラグイン「VK Filter Search」は無料で利用できますが、より高度な検索ができるよう、機能を拡張できる有料プラグイン「VK Filter Search Pro」もあります。機能の比較は以下を参考にしてください。

機能無料版Pro版で機能拡張
ブロックエディター対応
タクソノミー検索(カテゴリ・タグ・カスタム分類)
タクソノミー検索:段階プルダウン(多階層の動的絞り込み検索)
タクソノミー検索:アコーディオン設定(子階層のカテゴリーをクリックで開閉)
キーワード検索
投稿タイプ検索
投稿日付検索
カスタムフィールド検索(β版)
対象投稿タイプの指定(投稿・固定ページ・カスタム投稿タイプ)
検索結果ページにもフォームを挿入
投稿アーカイブページへの表示
チェックボタン・ラジオボタン
チェックボックス選択時の AND検索 / OR検索の設定
最小維持幅での指定
画面サイズ毎にブロック幅を設定
プルダウンで指定なしの場合に表記する文字を変更
ラベル(項目名)の任意変更
検索結果の並び替え
検索結果ページに検索条件を文字列で表示(フルサイト編集向け)

Pro版 VK Filter Search Pro もございます

より高度な絞り込み検索フォームを必要とする場合は、有料プラグイン「VK Filter Search Pro」をご検討ください。不動産サイトの物件検索で見かけるような高度な絞り込み検索フォームを作成できます。買い切りのライセンスで複数のサイトでご利用いただけます

PAGE TOP

このデモサイトは Vektor,Inc. のテーマとプラグインで構築されています。ご購入や詳細情報は下記のリンクもご参考ください。