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

WordPressサイトでは、多くの訪問者が検索機能を利用しています。残念なことに、WordPressのデフォルトの検索ボックスは十分に機能していないことが多く、本当にイライラさせられることがあります。探しているものが見つからなければ、その場を離れて他の場所に行ってしまうかもしれません。

カスタム検索フォームを作ることは、人々が必要なものを見つけやすくすることで、本当に役立ちます。最初は難しく感じるかもしれませんが、サイトをより使いやすくするために、やってみる価値はあります。

カスタム検索フォームを使えば、検索時に表示される内容をコントロールすることができ、最適なものを見つけてもらうことができます。設定するのは少し大変に感じるかもしれないが、訪問者を満足させることで得られる見返りは大きい。さらに、SearchWPのようなツールを使えば、そのプロセスを簡単に行うことができる。

この記事では、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」のどちらかを選択しよう。

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

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

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

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

別のルールを追加するには、「Add Rule」ボタンをクリックし、上記と同じプロセスを繰り返します。ルールの設定に満足したら、必ず『完了』をクリックしてください。

メディアやページなど、他のコンテンツタイプのルールを作成するには、そのセクションまでスクロールして「ルールを追加」ボタンをクリックします。

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

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

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

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

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

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

カスタム投稿タイプ用の高度な検索フォームを作成することもできます。例えば、’Deals’ と ‘Glossary’ ページ用にカスタム投稿タイプの検索フォームを作成しました。

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

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

これにより、カスタマイズ可能な新しい検索フォームが作成されます。

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

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

次の画面で、カスタム検索フォームの名前を入力します。

これはあくまで参考ですので、WordPressのダッシュボードでフォームを特定するのに役立つものであれば何でも構いません。

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

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

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

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

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

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

また、’Engine’メニューで、先に作成したカスタム検索エンジンを選択するようにしてください。結果ページ」については、WordPressのデフォルトバージョンを使用するか、カスタム検索結果ページを作成することができます。

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

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

検索結果からメディア、ページ、投稿を除外したい場合は、「検索の種類」フィールドの「メディア」、「ページ」、「投稿」の横にある小さな「X」をクリックするだけです。

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

例えば、オンラインストアを運営している場合、特定の商品カテゴリーを検索するフォームを作成することができます。

WordPressブログの場合、検索フォームに特定のコンテンツカテゴリーだけを含めることもできる。

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

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

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

その後、「Advanced Search Filter/s」フィールドまでスクロールすることができます。

デフォルトでは、SearchWPは、訪問者が「著者」、「投稿タイプ」、「タグ」を使用して結果をフィルタリングすることができます。

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

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

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

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

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

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

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

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

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

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

例として、投稿に検索フォームを追加する方法を見てみましょう。

WordPressのコンテンツエディターで投稿を開き、「+」アイコンをクリックするだけです。そして、「検索フォーム」と入力する。

適切なブロックが表示されたら、クリックして選択する。

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

検索フォームを公開する準備ができたら、「更新」または「公開」のいずれかをクリックしてください。

では、このページか投稿にアクセスして、実際に検索フォームをご覧ください。

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

検索フォームをウィジェット対応エリアに追加するには、外観 ” ウィジェットに移動する必要があります。ここで、検索フォームを表示したいエリアの’+’ブロックアイコンをクリックするだけです。

では、『検索フォーム』と入力してみよう。

適切なブロックが表示されたら、クリックするだけでウィジェット対応エリアに追加されます。

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

入力が終わったら、忘れずに「更新」ボタンをクリックして、検索フォームを本稼働させてください。

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

検索フォームをナビゲーションメニューに挿入したい場合は、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のカスタム検索フォームの作り方を学んでいただけたでしょうか？ブログ記事のコメントを検索可能にする方法や、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.