WordPress カスタム検索フォームの作り方 (ステップバイステップ)

WordPressサイトのカスタム検索フォームを作成したいですか？

検索は、ほとんどのユーザーがあなたのサイトで関連性のある興味深いコンテンツを見つける方法です。探しているものが簡単に見つからなければ、別のサイトに移動してしまうかもしれません。

この投稿では、WordPressのカスタム検索フォームを作成することで、サイト内検索を改善する方法をご紹介します。

なぜWordPressにカスタム検索フォームを作るのか？

WordPressには検索機能がビルトインされています。しかし、コメントや商品レビュー、カスタム投稿タイプなど、すべてのコンテンツを検索できるわけではありません。

これでは、あなたのオンラインストアで購入したい商品など、訪問者が探しているものを見つけることができないかもしれません。

また、検索結果の上位に表示されるように、あるコンテンツを他のコンテンツよりも優先させたい場合もあるでしょう。例えば、サイトの最新投稿を検索結果ページの一番上に表示させたり、WooCommerceの人気商品を表示させたりすることができます。

それでは、WordPressの検索フォームをカスタマイズする方法を見ていきましょう。この投稿では多くの内容を扱っているので、以下のクイックリンクから読みたいセクションにジャンプしてください：

ステップ1：カスタムのWordPress検索アルゴリズムを作成する

ビルトインWordPressの検索アルゴリズムを改善する最も簡単な方法は、SearchWPを使用することです。

SearchWPは最高のWordPress検索プラグインです。使いやすく、サイトの検索アルゴリズムを完全にコントロールできるので、訪問者が探しているものを素早く見つけることができる。WordPressが初期設定で無視しているコンテンツも検索します。

詳しくはSearchWPのレビューをご覧ください。

最初に行う必要があるのは、プラグインのインストールと有効化です。詳しくは、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。

有効化した後、SearchWP ” Settingsに行き、’General’タブをクリックする。

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

完了したら、「Verify Key」ボタンをクリックします。

プラグインを有効化した後、SearchWPがどのようにインデックスを作成し、検索し、コンテンツを表示するかを微調整することができる。あなたのWordPressブログやサイトのためだけのカスタムGoogle検索アルゴリズムを作成するようにこれを考えることができます。

まずは、SearchWP “ Algorithmにアクセスしてください。

ここでは、ページ、投稿、メディアファイルなど、SearchWPが初期設定で検索する異なるコンテンツタイプのセクションが表示されます。

より多くのコンテンツタイプを検索結果に含めるには、「ソースと設定」ボタンをクリックします。

SearchWPが検索できるすべての異なるコンテンツタイプがポップアップで表示されます。例えば、WordPressでブログのコメントを検索できるようにすることができます。

インストールされているWordPressプラグインによっては、追加のオプションが表示される場合があります。例えば、WooCommerceを使用している場合、SearchWPの検索結果に「商品」を含めることができます。

このトピックの詳細については、WooCommerce商品検索をスマートに行う方法をご覧ください。

検索結果に含めたい各コンテンツの横にあるボックスにチェックを入れるだけです。

また、初期設定では「Keyword Stems」が選択されていることにお気づきでしょう。これは、SearchWPが検索キーワードと同じ語尾を持たない結果を含む可能性があることを意味します。

たとえば、「run」と検索すると、キーワードのステミングによって、「running」と「runners」が検索結果に含まれる。

これは、訪問者に適切な結果を表示するのに役立ちますので、’キーワードステム’ボックスをチェックしたままにすることをお勧めします。ただし、完全一致のみを表示したい場合は、チェックを外すことができます。

ポップアップに入力した情報に満足したら、「完了」をクリックする。

選択したすべてのソースのセクションが表示されます。

各セクションにはそれぞれ「適用属性の関連性」スライダーがある。

これは、検索結果を作成する際にSearchWPが各属性に与える重みです。

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

属性をより重視するには、そのスライダーを右に動かすだけです。以下の画像では、検索エンジンは投稿コンテンツの一致よりも投稿タイトルの一致を重視します。

WordPressのサイトはそれぞれ異なるため、関連性の設定を変えてみて、最も正確で役立つ検索結果を得られるものを確認するとよいでしょう。

例えば、レストランのサイトにメニューをPDFでアップダーしている場合、これは重要なコンテンツであり、通常検索結果の上位に表示したいと思うでしょう。

カスタムフィールドを使用する場合、WordPressサイトでカスタムフィールドを検索可能にすることもできます。

また、特定のコンテンツを検索結果に含めるか除外するかを決定するルールを作成することもできます。例えば、オンラインマーケットプレイスを運営している場合、アカウントページ、購入手続きページ、サンキューページを除外したい場合があります。

ルールを作成したいセクションの「ルールの編集」ボタンをクリックするだけです。例えば、以下の画像では「投稿」セクションに新規ルールを追加しています。

検索エンジンのルールを編集するポップアップが開きます。

最初のルールを作成するには、「ルールの追加」ボタンをクリックします。

関連する検索結果に含める、または除外するコンテンツを選択できるようになりました。

まず、最初のドロップダウンメニューを開き、作成したいルールの種類に応じて、「Only show entries if（もし表示される場合のみ）」または「Exclude entries if（もし表示されない場合のみ）」のいずれかを選択する。

残りの設定を使用して、除外または含めるコンテンツを指定できます。例えば、特定のカテゴリーを含めたり除外したりしたい場合は、カテゴリー名を入力します。

また、除外または含めるカスタム・タクソノミーを入力することもできます。

検索結果から特定の投稿タグを除外または含めるには、ドロップダウンメニューを開き、「タグ」を選択するだけです。

次に、タグの名前を入力する。

別のルールを追加するには、「ルールの追加」ボタンをクリックし、上記と同じプロセスを繰り返します。ルールの設定に満足したら、「完了」をクリックする。

メディアやページなど、その他のコンテンツタイプについても、それぞれのセクションにスクロールして「ルールを追加」ボタンをクリックすることで、ルールを作成できるようになりました。

検索アルゴリズムの設定に満足したら、ページを一番上までスクロールし、「保存」をクリックする。

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

Index Status 100%’ と表示されれば、SearchWPがすべてのコンテンツとルールを検索インデックスに追加したことがわかります。

ステップ2：WordPressサイトのカスタム検索フォームを作成する

初期設定では、WordPressサイトのすべての検索フォームは、前のセクションで作成した新しいSearchWPアルゴリズムを使用します。これは、訪問者がより正確で関連性の高い結果をすぐに見ることができるようになることを意味します。

しかし、より良い結果を得るためには、様々な種類のコンテンツのための高度な検索フォームを作成することができます。例えば、特定の商品カテゴリーだけを検索するスマートなWooCommerce商品検索フォームを作成することができます。

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

各フォームはWordPressの初期設定の検索アルゴリズムを上書きするので、独自の設定でいくつでも異なるフォームを作成することができます。

まずはSearchWP” Search Formsにアクセスして、’新規追加’ボタンをクリックしてください。

これで新しい検索フォームが作成され、カスタマイズできるようになります。例えば、レビューサイトを運営している場合、商品レビュー投稿を検索するフォームを作成し、ブログ記事やメディアなどの他のコンテンツを無視することができます。これにより、訪問者が探しているものをより早く見つけることができます。

ここで、「フォームを検索 1」の隣にある小さな鉛筆のアイコンをクリックして、フォームに固有の名前を付けます。

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

これはあくまで参考ですので、WordPressダッシュボードでフォームを識別するのに役立つものであれば何でもお使いください。

その後、「レイアウトテーマ」のサムネイルを使ってレイアウトを選ぶことができる。

これらのレイアウトのいくつかは、特定の検索フォームのために設計されています。例えば、WordPressでカテゴリー別に検索するフォームを作成する場合、’カテゴリー検索’には必要な設定の多くがすでに用意されています。

各テーマをクリックすると、このフォームがあなたのサイトにどのように表示されるかのプレビューが表示されます。決定したら、「カスタムスタイリング」セクションまでスクロールしてください。

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

トグルを使用して、さまざまなオプションを無効化および有効化できます。変更を加えるとプレビューが自動的に更新されるので、あなたのサイトに最適なものを確認することができます。

レイアウトや作成したいフォームの種類によっては、「カスタマイザー」設定の有効化・無効化を行う必要があります。例えば、カテゴリー別に検索するフォームを作成したい場合、「カテゴリー検索」をクリックして有効化します。

また、’Engine’メニューで、先に作成したカスタム検索エンジンを選択することを本当に〜してもよいですか？結果ページに関しては、初期設定のWordPressを使用するか、カスタム検索結果ページを作成することができます。

初期設定では、SearchWPはWordPressサイト上のすべてのメディア、ページ、投稿を検索します。カスタム投稿タイプを作成した場合は、’検索のタイプ’フィールドを使用して検索結果に含めることができます。

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

検索結果からメディア、ページ、投稿を除外したい場合は、検索タイプ欄の「メディア」、「ページ」、「投稿」の次の小さな「X」をクリックしてください。

その後、「カテゴリーを選択」フィールドを見つけ、検索結果に含めたいカテゴリーをそれぞれ入力する。

例えば、オンラインストアを運営しているのであれば、特定の商品カテゴリーを検索するフォームを作りたいかもしれません。ブログの場合は、特定のコンテンツカテゴリーだけを検索フォームに含めたいかもしれません。

初期設定では、SearchWPは訪問者が検索クエリーを入力する前に、一般的な「キーワードを入力して検索」メッセージを表示します。

フィールド・ラベル」に入力することで、これを独自のメッセージに置き換えることができる。

投稿者、投稿タイプ、タグなどの要素を使って検索結果をフィルターできるようにしたい場合は、「高度な検索」トグルをクリックして有効化する必要があります。

その後、「Advanced Search Filter/s」フィールドまでスクロールする。初期設定では、SearchWPは訪問者が投稿者、投稿タイプ、タグを使用して結果をフィルターすることができます。

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

そして、ドロップダウンに適切なオプションが設定されたら、それをクリックする。

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

ここでは、異なるフォームスタイルから選択し、枠線を追加し、フォントサイズを変更することができます。

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

フォームの外観や動作を変更するために使用できる設定は他にもあります。しかし、高度なカスタム検索フォームを作成するのに必要な設定はすべてこれだけです。

フォームの設定に満足したら、画面を一番上までスクロールして「保存」をクリックし、設定を保存します。

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

ステップ3:カスタム検索フォームをWordPressサイトに追加する

検索フォームブロックを使って、どのページ、投稿、ウィジェット対応エリアにも高度な検索フォームを追加できます。

例として、投稿に検索フォームを追加する方法を見てみましょう。WordPressのコンテンツエディターで投稿日を開き、’+’アイコンをクリックします。そして「検索フォーム」と入力します。

適切なブロックが外観されたら、それをクリックする。

フォームの選択」ドロップダウンを開き、使用するフォームを選択します。

検索フォームを公開する準備ができたら、「更新」または「公開する」のどちらかをクリックしてください。あとはこのページか投稿にアクセスするだけで、実際に検索フォームが表示されます。

詳しくは、WordPressの投稿日に検索フォームを追加する方法をご覧ください。

検索フォームをウィジェット対応エリアに追加するには、外観 ” ウィジェットにアクセスしてください。ここで、検索フォームを表示したいエリアの「+」ブロックアイコンをクリックします。

次に「Search Form」と入力する。

右のブロックが外観されたら、クリックしてウィジェット準備エリアに追加する。

ドロップダウンメニューを開き、使用する検索フォームを選択することができます。

更新が完了したら、「更新」ボタンをクリックし、検索フォームを表示させます。

より詳細な手順については、ウィジェットの追加と使用方法に関するガイドを参照してください。

ナビゲーションメニューに検索フォームを挿入したい場合は、WordPressメニューに検索バーを追加する方法の投稿をお読みください。

カスタムWordPress検索フォームを最適化するボーナスのヒント

WordPressサイトにカスタマイザー検索フォームを作成する方法がわかったところで、より良いユーザーエクスペリエンスを実現するための簡単な改善方法を見ていきましょう。

設定1: カスタム検索フォームにライブAjax検索を追加する

多くのオンラインマーケットやサイトでは、ライブAjax検索を使用しています。これはユーザーがカスタムフォームに入力すると、自動的に検索結果を表示するもので、Googleなどの検索エンジンの仕組みに似ています。

Ajaxライブ検索では、ページをリロードすることなく、関連する結果を表示することができます。これにより、買い物客が検索クエリーに一致する商品を即座に見ることができるため、デジタルダウンロードや物理的な商品をオンラインで販売する場合に最適な選択肢となります。

WordPressにAjaxライブ検索を追加する最も簡単な方法は、SearchWP Live Ajax Lite Searchを使用することです。この無料プラグインは、自動的にあなたのサイトにインスタント検索を追加し、任意のWordPressテーマと完璧に動作します。

最初に行う必要があるのは、プラグインのインストールと有効化です。詳しくは、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。

有効化すると、初期設定のWordPress検索フォームが自動的にAjaxライブ検索機能を使用するようになります。サイトにアクセスし、検索バーに入力し始めると、インスタント検索が表示されます。

より詳細な手順については、WordPressサイトにライブAjax検索を追加する方法のガイドを参照してください。

オプション2：SearchWPの高度な設定を使用する

次に、ユーザーが探しているものを見つけやすくするために、高度な設定を有効化することをお勧めします。

これを行うには、SearchWP ” Settingsに行き、’General Settings’セクションまでスクロールします。

ここでは、以下のいずれかの設定を有効化することができます：

• 部分一致： この設定を有効にすると、SearchWPは訪問者の検索クエリーに対して完全一致ではない結果を表示します。これはファジー検索としても知られています。
• 最も近い一致：部分一致を有効化すると、検索結果がない場合に最も近い一致を表示することもできます。
• “引用 “検索： これは、訪問者が引用符を使用して正確なフレーズを検索することができます。
• キーワードのハイライト： 検索キーワードを自動的にハイライトし、訪問者が探しているものを見つけやすくします。

設定3：検索結果の測定とコンバージョンの改善

サイトの検索を微調整するために、訪問者が検索機能をどのように使用しているかをモニターすることをお勧めします。これにより、WordPressブログで何がうまくいっていて、何がうまくいっていないかを確認することができ、サイトの検索を定数改善し、訪問者が探しているものを見つけられるようにすることができます。

このデータは、訪問者がすでに検索しているコンテンツを表示することで、ブログ投稿のアイデアを生み出すのにも役立ちます。

検索履歴と最も人気のある検索キーワードを見るには、左側のメニューから「統計」を選択するだけです。

このチュートリアルで、カスタマイザー WordPress 検索フォームの作成方法を学んでいただけたでしょうか？また、中小企業に最適なライブチャットソフトウェアや 無料のビジネス メールアドレスを取得する方法についてのガイドもご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.