WordPressで複数の検索フォームを使用する方法

WordPressの検索で、たとえば顧客が商品を検索しているのにブログ投稿が表示されるなど、コンテンツが混在すると、混乱したエクスペリエンスが生まれます。eコマースストアとアクティブなブログの両方があるサイトで、これが何度も発生するのを見てきました。

結果として、ユーザーは混乱し、コンバージョンを逃し、エンゲージメントが低下します。

ここが重要な点です。WordPressウェブサイトによっては、単一の検索フォームが常に最適とは限りません。サイトのさまざまな部分で、さまざまな種類の検索が必要になります。

例えば、オンラインストアでは、買い物客はブログ記事ではなく、商品だけを検索したいと考えています。その解決策は、コンテンツの種類ごとに個別の検索フォームを作成することです。

WPBeginnerでは、ウェブサイトの所有者がこの問題を解決するお手伝いをしてきました。この記事では、WordPressサイトに複数の検索フォームを追加して使用する方法をご紹介します。私たちは、多くの異なるウェブサイトで私たちにとって最も効果的だったものを共有します。🙌

WordPressで複数の検索フォームを使用する方法

WordPressで複数の検索フォームを使用する理由

検索フォームは、訪問者が探しているものをすばやく見つけるのに役立ちます。ただし、コンテンツが多い場合は、特定の種類のコンテンツを検索する複数のフォームを作成するのが理にかなっているかもしれません。

例えば、オンラインストアを運営している場合、製品に特化したスマートなWooCommerce製品検索を作成することができます。

カスタム投稿タイプ用の高度な検索フォームを作成することもできます。例えば、WPBeginnerでは、ディールページや用語集ページ用にカスタム投稿タイプ検索フォームを作成しました。

WPBeginnerウェブサイトでのカスタム検索フォームの例

サイトのさまざまな場所に異なる検索フォームを使用することで、公開されているコンテンツの量に関係なく、訪問者が正確で役立つ検索結果を得られるようになります。これにより、訪問者のエクスペリエンスが向上し、より長く滞在するよう促すことができます。

それでは、WordPressで複数の検索フォームを作成する方法をご紹介します。以下のクイックリンクを使用して、このチュートリアルを進めることができます。

さあ、始めましょう。

ステップ 1: SearchWP のインストールとセットアップ

WordPressウェブサイトに複数の検索フォームを追加する最も簡単な方法は、50,000以上のサイトで使用されている、SearchWP、つまりWordPress向けの最高の検索プラグインを使用することです。

SearchWPを使用すると、WordPressがデフォルトで無視するコンテンツも検索できます。これには、カスタム投稿タイプ、WooCommerceの商品、カテゴリ、PDFファイルなどが含まれます。

複数の検索フォームを作成し、それらのフォームを任意のページ、投稿、またはウィジェット対応領域に追加することもできます。詳細については、当社の詳細なSearchWPレビューを参照してください。

SearchWP

まず、SearchWPプラグインをインストールして有効化する必要があります。詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドをご覧ください。

有効化したら、 SearchWP » 設定 に移動し、「一般」タブをクリックしてください。

SearchWPライセンスキーを入力

ここで、「ライセンスキー」ボックスにライセンスを入力する必要があります。この情報は、SearchWPサイトのアカウントで見つけることができます。

これが完了したら、「キーを検証」ボタンをクリックするだけです。

ステップ2:カスタムWordPress検索アルゴリズムの設定

ライセンスキーを入力した後、SearchWP がコンテンツをインデックス化、検索、表示する方法を微調整することをお勧めします。これは、あなたの WordPressブログ またはウェブサイト専用のカスタムGoogle検索アルゴリズムを作成すると考えることができます。

これらは、すべての検索フォームがデフォルトで使用する一般的な設定です。これらの設定は、個々の検索フォームで上書きできます。

開始するには、SearchWP » アルゴリズムに移動します。

SearchWP検索最適化WordPressプラグイン

ここでは、ページや投稿など、SearchWPがデフォルトで検索するさまざまなコンテンツタイプのセクションが表示されます。

各項目に「適用可能な属性関連性」スケールがあることに気付くでしょう。これは、SearchWPが各属性に与える重み(重要度)です。

SearchWPの適用属性関連性の設定

関連性の高い属性に一致するコンテンツは、検索結果の上位に表示されます。対照的に、関連性の低い属性に一致するコンテンツは、検索結果ページの下位に表示されます。

関連性を変更するには、さまざまなスライダーをドラッグするだけです。たとえば、「タイトル」スライダーを左に、「コンテンツ」スライダーを右に移動すると、タイトルよりもコンテンツの方が重みを持つようになります。

カスタム検索アルゴリズムで異なる関連性設定を持つ属性の例

SearchWPには、WordPressがデフォルトで無視するコンテンツも検索するように指示できます。

これを行うには、「ソースと設定」ボタンをクリックします。

WordPressでより多くのコンテンツを検索可能にする方法

これで、さまざまなコンテンツタイプの横にあるチェックボックスを選択できるようになりました。

たとえば、ブログのコメントを検索可能にしたり、WordPressにPDFのインデックス作成と検索を追加したりしたい場合があります。

変更に満足したら、「完了」ボタンをクリックしてください。

WordPressの検索結果にコメント、メディアなどを追加する方法

これにより、各コンテンツタイプに新しいセクションが追加されます。ここでも、さまざまなスライダーを使用して属性の関連性を変更できます。

検索アルゴリズムの設定方法に満足したら、画面の上部までスクロールして「保存」ボタンをクリックします。

カスタムWordPress検索アルゴリズムの保存

SearchWPは自動的にインデックスを再構築します。インターネット接続の速度とWordPressホスティングプロバイダーによっては、数分かかる場合があります。

「インデックスステータス 100%」と表示されたら、SearchWPがすべてのコンテンツと設定をインデックス化したことがわかります。

WordPress検索インデックスの再構築

ステップ3:WordPressで複数の異なる検索フォームを作成する

これで、好きなだけ多くの異なる検索フォームを作成できます。

開始するには、SearchWP » Search Formsに移動し、「新規追加」ボタンをクリックします。

WordPress ウェブサイトにカスタム検索フォームを追加する

これにより、カスタマイズ可能な新しい検索フォームが作成されます。たとえば、レビューサイトを運営している場合、製品レビュー投稿を検索し、ブログ投稿やメディアなどの他のコンテンツを無視するフォームを作成できます。

まず、'Search Form 1' の横にある小さな鉛筆アイコンをクリックして、フォームに一意の名前を付ける必要があります。

検索フォームに名前を追加する

カスタム検索フォームの名前を入力します。

WordPressで複数の検索フォームを作成するため、WordPressダッシュボードでこのフォームを識別するのに役立つ名前を使用することが重要です。

カスタム検索フォームにタイトルを追加する

その後、「レイアウトテーマ」のサムネイルを使用してレイアウトを選択できます。

これらのレイアウトの中には、特定の検索フォーム用に設計されたものもあります。例えば、WordPressでカテゴリ別に検索するフォームを作成している場合は、「カテゴリ検索」を選択することをお勧めします。これは、必要な設定の多くがすでに含まれているためです。

カスタム検索フォームのレイアウトを選択する

フォームがウェブサイトでどのように表示されるかのプレビューを確認するには、さまざまなテーマをクリックするだけです。

決定したら、「カスタムスタイリング」セクションまでスクロールしてください。

表示される設定は、テーマのレイアウトによって異なる場合があります。たとえば、「クイック検索」を選択した場合、「クイック検索」設定がデフォルトで有効になります。

クイック検索 SearchWP テーマと設定

各オプションは、トグルを使用して無効化および有効化できます。ライブプレビューは変更に合わせて自動的に更新されるため、さまざまな設定を試して最適なものを見つけることができます。

レイアウトや作成したいフォームの種類によっては、「カスタムスタイリング」設定の一部を有効または無効にする必要がある場合があります。

カテゴリで検索するフォームを作成したいですか?その場合は、「カテゴリ検索」トグルを有効にする必要があります。

その後、「カテゴリを選択」フィールドを見つけ、検索結果に含めたい各カテゴリを入力します。たとえば、オンラインストアを運営している場合は、特定のWooCommerceの製品カテゴリを検索するフォームを作成したい場合があります。

WordPressで複数の検索フォームを作成する

訪問者が著者、投稿タイプ、タグなどの要因を使用して検索結果を絞り込めるようにしたい場合は、「高度な検索」トグルを有効にする必要があります。

その後、「高度な検索フィルター」フィールドまでスクロールします。デフォルトでは、SearchWPは訪問者が著者、投稿タイプ、タグを使用して結果をフィルター処理できるようにします。

WordPressで高度な検索フォームを作成する

これらのフィルターを削除するには、その「X」ボタンをクリックするだけです。さらにフィルターを追加したい場合は、フィールドにその名前を入力してください。

次に、ドロップダウンで適切なオプションが表示されたら、クリックします。

WordPress検索にフィルターを追加する

デフォルトでは、フォームはメディア、ページ、投稿を検索します。カスタム投稿タイプを作成した場合は、これらを検索結果に含めたい場合があります。

これを行うには、[検索の種類]フィールドを見つけてクリックします。

WordPressウェブサイトに複数の検索フォームを追加する

これで、各カスタム投稿タイプの名前を入力できます。

適切なカスタム投稿タイプが表示されたら、クリックして検索に追加します。

WordPressでカスタム投稿タイプを検索する方法

検索結果からページ、投稿、またはメディアを除外したいですか?

次に、[メディア]、[ページ]、または[投稿]の横にある小さな[X]をクリックします。

WordPressの検索結果からコンテンツタイプを削除する

SearchWPが検索するコンテンツの種類に満足したら、検索バーにプレースホルダーテキストを追加したくなるかもしれません。

ここでは、検索フォームの仕組みと、どのような結果が期待できるかを訪問者に知らせることをお勧めします。たとえば、オンラインマーケットプレイスをお持ちの場合、「商品を検索」や「ショッピングを開始」といったテキストを使用すると良いでしょう。

デフォルトでは、SearchWPは「キーワードを入力して検索」という一般的なメッセージを表示します。「フィールドラベル」に自分で入力することで、このメッセージを置き換えることができます。

WordPressのブログまたはウェブサイトの検索フォームにラベルを追加する

デフォルトでは、検索フォームには虫眼鏡と青い「検索」ボタンが表示されます。

「検索」ボタンを削除するには、「検索ボタン」トグルをクリックして無効にするだけです。

WordPressで検索フォームをカスタマイズする

これらの設定に満足したら、「フォームスタイル」セクションまでスクロールします。

ここで、さまざまなフォームスタイルを選択したり、境界線を追加したり、フォントサイズを変更したりできます。

SearchWPのスタイルを変更する

「ボタンのスタイル」の下で、フォームに表示される「検索」ボタンをカスタマイズできます。

最後に、フォームの設定が完了したら、画面上部までスクロールして「保存」をクリックして設定を保存します。

カスタムWordPress検索フォームを保存する

よりユニークな設定を持つカスタム検索フォームをさらに作成するには、上記で説明したのと同じプロセスを繰り返すだけです。

ステップ4:WordPressサイトに複数の検索フォームを追加する

ショートコードまたは検索フォームブロックを使用して、任意のページ、投稿、またはウィジェット対応エリアに複数の検索フォームを追加できます。

最も簡単な方法なので、まずブロックメソッドを見てみましょう。

オプション1:ページまたは投稿に検索フォームを追加する

特定のページや投稿に検索フォームを追加したり、投稿コンテンツ内に表示したりすることもできます。

たとえば、FAQページ、ドキュメント、ヘルプデスク、ナレッジベースなどに検索フォームを追加することができます。これにより、ユーザーが回答や役立つリソースを見つけやすくなり、顧客体験を向上させることができます。

ページ内の検索フォームの例

開始するには、フォームを追加したいページまたは投稿に移動するだけです。

次に「+」アイコンをクリックして、「検索フォーム」と入力します。

ブロックを使用してページまたは投稿に検索フォームを追加する

適切なブロックが表示されたら、クリックしてください。

「フォームを選択」ドロップダウンを開き、このページまたは投稿に表示したいフォームを選択できるようになりました。

検索フォームの選択

検索フォームを公開する準備ができたら、[更新] または [公開] をクリックするだけです。次に、このページまたは投稿にアクセスして、検索フォームが機能していることを確認してください。

オプション2:ウィジェット対応エリアに検索フォームを追加する

その他のオプションとして、サイドバーなどのウィジェット対応エリアに検索フォームを追加することもできます。これは、WordPressウェブサイトの複数のページに同じ検索バーを表示する簡単な方法です。

外観 » ウィジェットに移動して、ウィジェットを追加できるすべての異なるエリアを確認してください。

ブログやウェブサイトに検索ウィジェットを追加する

表示されるオプションは、お使いの WordPressテーマ によって異なる場合があります。たとえば、Astra テーマを使用している場合、サイドバーウィジェットエリアは「メインサイドバー」と呼ばれます。

ウィジェットを追加したい場所に表示される「+」ブロックアイコンをクリックするだけです。

新しいブロックウィジェットを追加

次に、「検索フォーム」と入力します。

適切なブロックが表示されたら、クリックしてウェブサイトに追加します。

ウェブサイトに検索フォームウィジェットを追加する

ドロップダウンメニューを開き、使用したい検索フォームを選択できるようになりました。

完了したら、「更新」ボタンをクリックして検索フォームを公開します。

ブログまたはウェブサイトに検索フォームを追加する

これで、サイトにアクセスして改善された検索フォームを確認できます。

このトピックの詳細については、WordPressでウィジェットを追加して使用する方法に関するガイドをご覧ください。

オプション3:フルサイトエディターを使用して検索フォームを追加する

ブロックWordPressテーマを使用している場合は、フルサイトエディターを使用して検索フォームを追加できます。標準のWordPressコンテンツエディターでは編集できない領域が含まれています。たとえば、WordPressの404テンプレートに検索フォームを追加できます。

開始するには、WordPressダッシュボードの [外観] » [エディター] に移動してください。

フルサイトエディター(FSE)を使用したライブAjax検索の追加

これで、ブロックテーマを編集するためのオプションが表示されます。

例として、ページテンプレートに検索フォームを追加する方法を示します。これを行うには、「テンプレート」メニューをクリックします。

フルサイトエディターで編集するテンプレートの選択

これで、WordPressテーマを構成するすべてのテンプレートのリストが表示されます。

編集したいテンプレートまたはテンプレートパーツを見つけて、クリックするだけです。

ウェブサイトのテンプレートまたはテンプレートパーツにカスタム検索フォームを追加する

WordPressは、このテンプレートのプレビューを表示します。

テンプレートを編集するには、小さな鉛筆アイコンをクリックします。

アーカイブテンプレートに検索フォームを追加する

次に、「+」アイコンをクリックします。

表示されるパネルに「検索フォーム」と入力します。

SearchWP検索ウィジェットをWordPressに追加する

適切なブロックが表示されたら、それをレイアウトにドラッグアンドドロップします。

ドロップダウンメニューを開き、使用したい検索フォームを選択できるようになりました。

WordPressで異なる検索フォームウィジェットを表示する

これが完了したら、「保存」ボタンをクリックして変更を公開します。

オプション4:ショートコードを使用してWordPressに検索フォームを追加する

ショートコードを使用して検索フォームを追加する別の方法もあります。同じ検索フォームを複数のページ、投稿、またはウィジェット対応エリアに追加したい場合は、同じショートコードを複数の場所に貼り付けるだけで済むため、こちらの方が簡単なオプションかもしれません。

検索フォームのショートコードを取得するには、SearchWP » 検索フォーム に移動します。ここで、表示したい検索フォームを見つけ、「ショートコード」列の値をコピーします。

ショートコードを使用してWordPressに検索フォームを追加する方法

これで、ショートコードを任意のページ、投稿、またはウィジェット対応領域に追加できます。ステップバイステップの手順については、WordPressでショートコードを追加する方法に関するガイドを参照してください。

オプション5:ナビゲーションメニューに検索フォームを追加する

多くの場合、ウェブサイトには検索フォームのあるページと検索バーを含むメニューがあります。これにより、ユーザーがどこにいても、必要に応じてヘッダーセクションまでスクロールして検索機能を使用できます。

これに興味がある場合は、SearchWPを使用してWordPressメニューに検索バーを追加する方法に関するガイドをご覧ください。

ボーナスヒント:検索アナリティクスを使用して検索フォームを最適化する

複数の検索フォームの設定は始まりにすぎません。サイトの検索エクスペリエンスを真に向上させるには、訪問者がこれらのフォームをどのように使用するかを理解する必要があります。

そこでおすすめなのがSearchWPのMetrics拡張機能です。これは、ユーザーがサイトで何を検索しているか、何件の結果が表示されたか、そしてどの結果をクリックしたかを追跡します。このデータは、あなたのオーディエンスが実際に何を求めているかを舞台裏から覗き見ることができます。

🎯 プロのヒント: SearchWPのMetrics拡張機能は、Proプラン以上に含まれています。インストールしたら、ダッシュボードのSearchWP » Metricsに移動して、リアルタイムの検索インサイトを確認してください。

例えば、次のようなことができます。

  • 人気のあるキーワードを見つけて内部リンクを改善するか、新しいコンテンツを作成する
  • 「結果なし」の検索を特定し、不足しているコンテンツを追加するか、検索フィルターを修正する
  • どの検索フォームがより多くのクリックとエンゲージメントにつながるかを確認する
SearchWPの指標

内部検索アナリティクスを定期的に確認することで、各フォームの設定を微調整し、コンテンツ戦略を調整できます。そうすることで、訪問者が繰り返し訪れるような、よりスムーズな体験を作り出すことができます。

手順については、WordPressで検索アナリティクスを確認する方法に関するガイドをご覧ください。

🙋‍♀️ よくある質問:WordPressで複数の検索フォームを使用する方法

なぜ、そしてどのように複数の検索フォームを使用するのかがわかったところで、WordPressで検索機能をカスタマイズおよび拡張することについて、ユーザーがよく抱く質問にいくつかお答えしましょう。

サイトで複数の検索フォームを使用する利点は何ですか?

複数の検索フォームは、eコマース商品、ブログ記事、またはカスタムコンテンツなどの特定のコンテンツタイプに焦点を当てることで、ユーザーが探しているものを正確に見つけるのに役立ちます。これにより、検索精度、ユーザー満足度、サイト滞在時間が向上し、コンバージョンが増加する可能性もあります。

各検索フォームの外観をカスタマイズできますか?

はい。ほとんどのWordPress検索プラグインでは、サイトのさまざまな部分に合わせて各フォームをスタイル設定できます。組み込み設定またはカスタムCSSを使用して、色、ボタンテキスト、プレースホルダーテキスト、レイアウトを変更できます。

カスタム投稿タイプの高度な検索フォームを作成するにはどうすればよいですか?

SearchWPやCustom Post Type UIのようなプラグインを使用すると、イベント、ポートフォリオ、製品などのカスタム投稿タイプを検索結果に含めることができます。

カスタム投稿タイプのWordPress検索フォームを作成する

また、各検索フォームに表示するコンテンツの種類を制御することもできます。

WordPressでマルチステップフォームを作成するにはどうすればよいですか?

WordPressでマルチステップフォームを作成することは、複数の検索フォームを設定することとは異なります。

とはいえ、WPFormsFormidable Forms のようなドラッグ&ドロップフォームビルダーを使用して、マルチステップフォームを作成できます。これらは、長いフォームを小さく簡単なセクションに分割し、ユーザーエクスペリエンスとフォーム完了率を向上させます。

この記事がWordPressで複数の検索フォームを使用する方法を学ぶのに役立ったことを願っています。また、以下のガイドも参照してください。

この記事が気に入ったら、WordPressのビデオチュートリアルについては、YouTubeチャンネルを購読してください。 TwitterFacebookでもフォローできます。

開示:当社のコンテンツは読者によってサポートされています。これは、当社のリンクの一部をクリックすると、当社が手数料を得る可能性があることを意味します。WPBeginnerがどのように資金提供されているか、それがなぜ重要か、そしてどのように私たちをサポートできるかについては、こちらをご覧ください。当社の編集プロセスはこちらです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです!

読者とのインタラクション

17 CommentsLeave a Reply

  1. わあ、複数の検索フォームを持てるなんて知りませんでした。個別のフォームで特定の領域の検索結果を改善できると知ってよかったです。そして、SearchWPプラグインがこれほど素晴らしいツールであることを改めて証明してくれました!

  2. そして、各フォームのプレースホルダーテキストをどのように変更しますか?
    例えば、フォーム1のプレースホルダーテキスト:「通常のブログを検索」。フォーム2のプレースホルダーテキスト:「書籍を検索」。

    • オプションの1つとして、各テキストを表示したい入力タグに placeholder = "text" を追加できます。

      管理者

  3. I cannot get this to work, search results come up with a blank page :(
    Anyone else get this working or know of another solution for creating multiple forms?

    • ダニー様

      Did you get this to work? The / is depreciated – use in the actual form rendering instead and it works :)

      お役に立てば幸いです。

      • これを正確に実行しましたが、検索を実行すると適切な検索結果テンプレートをロードできますが、結果は表示されません。また、フォームのいずれかで検索すると、戻ったときに別のフォームの入力フィールドに検索語が表示されます。

        どなたか何か手がかりをいただけると大変助かります。インターネットでどうやっても有用なものが見つかりません…

  4. これは解決しましたか?機能しますか?この投稿で時間を投資しているので、そうであることを願っています。

  5. templateの名前をnormal-search.phpやbook-search.phpの代わりにsearch-normal.phpやsearch-book.phpとすることは可能でしょうか?

  6. 管理者様、このチュートリアルに従っても効果的な結果が得られないのはなぜかわかりません。

  7. …検索ボックスを過剰にコーディングしすぎていると思いますが、まったく機能しないと誰かに言われましたか?

  8. これには小さな問題があります。ページに2つの検索フォームを配置すると、同じid(id='s')を持つ入力ボックスが2つできてしまいます。これは少なくとも検証に失敗します。

返信を残す

コメントを残していただきありがとうございます。すべてのコメントは、当社のコメントポリシーに従ってモデレーションされますので、ご了承ください。メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で有意義な会話をしましょう。