WordPressのページに検索ボックスを追加する方法を知りたいですか?
訪問者が検索を実行するよう促し、コンテンツの発見可能性を高め、ページビュー数を増やします。
このガイドでは、WordPress初心者の方でも、数回のクリックでページに検索ボックスを追加する方法を学びます。
始めましょう!
WordPressページに検索ボックスを追加するメリット
ページに検索バーを追加すると、以下のようになります:
- ページビュー数を増やす:訪問者はブログ記事やページに検索バーが表示されると、特に促された場合、それを使用する可能性が高くなります。
- コンテンツの発見可能性を高める:閲覧数の少ないコンテンツにも、見つけてもらうチャンスを与えましょう。
- より関連性の高い検索結果を提供する:検索ボックスを特定のコンテンツタイプやカテゴリに限定することで、訪問者が探しているものをより速く見つけられるようにします。
- 平均セッション時間を延長する:訪問者がサイトを探索するコンテンツが多いほど、サイトに滞在する時間が長くなります。
- 検索エンジンでのランキングを上げる:平均セッション時間が長いことは、Googleにとってあなたのサイトが検索結果でより良い順位を獲得する価値があるという強力なシグナルです。
それでは、WordPressのページに検索ボックスを追加する方法を見ていきましょう。
WordPressでカスタム検索バーを追加する方法
WordPressのページにカスタム検索バーを追加する最も簡単な方法は、SearchWPのようなプラグインを使用することです。

これは、多くの便利な機能を備えた、最も初心者向けのWordPress検索プラグインです。
SearchWPを使用すると、ビジネス目標に合わせてサイトの検索機能を完全にカスタマイズできます。
たとえば、検索結果の順序を変更したり、検索を投稿のみに限定したり、ライブ自動補完検索を追加したりできます。
そして、これはプラグインの機能のほんの一部です!
SearchWPでは、次のことも可能です:
- 訪問者の検索を追跡する:これにより、オーディエンスが何に興味を持っているかを知り、彼らが望むコンテンツを提供できます。
- サイトに複数の検索フォームを追加する:特定のニーズに合わせてカスタム検索フォームを作成し、サイト全体に配置できます。
- 検索結果で検索語をハイライトする:これにより、訪問者は検索結果で探しているものを見つけたかどうかを簡単に認識できます。
- サイトであいまい検索を有効にする:これにより、訪問者は検索クエリに誤字があっても正しいコンテンツを見つけることができます。
50,000以上のウェブサイト所有者がすでにSearchWPを使用して、検索機能を強化し、訪問者にさらに関連性の高い検索結果を提供しています。
あなたも参加しませんか?それでは、このプラグインを使用してページに検索ボックスを追加する方法を見ていきましょう。
ステップ1:SearchWPのインストール
開始するには、ウェブサイトにアクセスして新規アカウントにサインアップし、SearchWPのコピーを入手する必要があります。
完了したら、SearchWPアカウントにアクセスし、ダウンロードタブに移動するだけです。

次に、SearchWPをダウンロードボタンを押し、プラグインのZIPファイルをコンピューターに保存します。
ダウンロード後、左下隅にあるライセンスキーをコピーします。
次のステップは、WordPressウェブサイトにSearchWPプラグインをインストールして有効化することです。
まず、ダウンロードしたZIPファイルをサイトにアップロードする必要があります。ヘルプが必要な場合は、WordPressプラグインのインストール方法チュートリアルを確認してください。
その後、SearchWPへようこそ画面とセットアップウィザードが表示されます。「オンボーディングウィザードを開始」ボタンをクリックし、画面の指示に従ってください。
SearchWPをインストールした後、WordPressダッシュボードに移動し、トップバーのSearchWPボタンにカーソルを合わせ、ライセンスを有効化をクリックします。

これで、検索エンジンをカスタマイズする準備ができました。
ステップ2:検索エンジンのカスタマイズ
次に、WordPressダッシュボードからSearchWP » アルゴリズムに移動して、検索エンジンをカスタマイズできます。
検索エンジンは、検索を実行する際に従う一連のルールと考えることができます。これらのルールをカスタマイズすることで、サイトでの検索方法を変更できます。
たとえば、カスタムフィールドを含めたり、特定のページを検索結果から除外したり、投稿タグによる検索を有効にしたり、その他多くのことができます。
開始するには、ソースと設定ボタンをクリックします。

次に、検索エンジンのソースを選択できるポップアップウィンドウが開きます。
ご覧のとおり、4つの検索ソースがあります:投稿、ページ、メディア、ユーザーです。

たとえば、この検索エンジンに投稿のみを検索させたいとします。これにより、サイトの検索結果を整理し、訪問者がより早く適切なコンテンツを見つけられるようにすることができます。
次に、投稿以外のすべての検索ソースのチェックを外します。

検索エンジンの設定のカスタマイズが完了したら、完了ボタンを押します。
次に、訪問者がタグやカスタムフィールドで投稿を検索できるようにすることもできます。
開始するには、投稿セクションに移動し、属性の追加/削除ボタンをクリックします。

次に、新しいウィンドウがポップアップ表示され、検索を実行する際に考慮したいカスタムフィールドとタクソノミーを指定できます。
たとえば、不動産ウェブサイトがあるとします。検索プロセスに寝室数などのカスタムフィールドを含めることができます。

次に、投稿タグやカテゴリによる検索も許可できます。
まず、タクソノミーフィールドをクリックし、ドロップダウンメニューから「タグ(post_tag)」または「カテゴリ(category)」を選択します。

次に、タグタクソノミーを見つけてクリックします。
これで、サイトの訪問者はタグやカスタムフィールドで投稿を検索できるようになります。
属性の管理が完了したら、完了ボタンを押して変更を保存します。
最後のステップは検索エンジンを保存することです。それを行うには、右上隅にある Save Engines ボタンをクリックします。

ステップ 3: 検索フォームを作成する
検索フォームをカスタマイズしたので、次のステップは新しい検索フォームを作成することです。
まず、WordPressダッシュボードから SearchWP » Algorithm にアクセスし、「Add New」ボタンをクリックします。

次の画面で、上部にあるフォームの名前を変更できます。
その後、SearchWPは選択できるさまざまなテーマレイアウトを提供します。

下にスクロールすると、フォームをカスタマイズするためのオプションがさらに表示されます。
さらに、フォームのエンジン、結果ページなどを選択できます。

詳細については、WordPressでカスタム検索フォームを作成する方法に関するガイドをご覧ください。
ステップ 4: WordPressページに検索バーを追加する
SearchWPは、検索フォームを任意のページに自動的に埋め込むオプションも提供しています。
検索フォームページにある「Embed」ボタンをクリックするだけです。

次に、Gutenbergブロック、ショートコード、またはPHPコードを含むさまざまな埋め込みオプションを持つ新しいウィンドウが開きます。
このチュートリアルでは、「Gutenberg Block」を選択し、新しいページに追加します。

または、任意のページにSearchWPブロックを追加して検索ボックスを表示することもできます。
開始するには、WordPressダッシュボードの Pages » Add New に移動します。

ページエディタに移動したら、+ ボタンをクリックして新しいブロックを追加します。
SearchWP Form ブロックに移動し、ページに追加するだけです。

その後、検索フォームを選択する必要があります。
SearchWP Formブロックのドロップダウンメニューをクリックして、フォームを選択するだけです。

完了したら、Publish ボタンをクリックします。
ページが公開されたら、新しい検索ページを確認できます。
テストサイトでのこのページの表示は次のとおりです。

検索ボックスが正しく機能することを確認するためにテストしましょう。
さまざまなカテゴリのWordPressに関連する投稿が多数ありますが、そのうちの1つだけが Tutorials カテゴリに関連付けられています。
WordPress を検索して、どのような結果が得られるか見てみましょう。

ご覧のとおり、Tutorials カテゴリ内に配置された単一の投稿のみが見つかります。
これは、検索ボックスが期待どおりに機能していることを意味します。

WordPressページビルダーに検索ボックスを追加する
SearchWPを使用する最も良い点は、最も人気のあるWordPressウェブサイトやランディングページビルダーのいくつかに検索フォームを追加できることです。
それらにそれぞれ検索ボックスを簡単に追加する方法を見ていきましょう。
1. Oxygen Builder
Oxygenは、サイトのデザインを細かく制御できる、堅牢なビジュアルサイトビルダーです。
レイアウトの構築にOxygenを使用している場合、SearchWPフォーム要素を使用して検索フォームを簡単に統合できます。

要素を追加し、ドロップダウンメニューからフォームを選択するだけです。ランディングページに追加できるSearchWP結果要素もあります。
詳細については、Oxygenビジュアルサイトビルダーを使用して検索ボックスを追加する方法に関するガイドをご覧ください。
2. Elementor
WordPressで最も人気のあるページビルダーの1つであるElementorは、要素のドラッグアンドドロップを簡単にします。
SearchWPはElementorとシームレスに統合されており、ページ上のどこにでも検索ウィジェットを配置できます。

これにより、Elementorの魅力的なランディングページに強力な検索フォームを追加できます。
詳細については、Elementorページに検索ボックスを追加する方法に関するガイドをご覧ください。
3. WPBakery
WPBakery Page Builderは、フロントエンドとバックエンドの両方の編集機能を提供し、多くのWordPressサイトで引き続き人気のある選択肢です。
特定のコンテンツ要素を使用して、WPBakeryの行と列内に検索フォームを配置できます。
WPBakeryで検索フォームを追加するには、ページ上のどこにでもSearchWPフォーム要素を追加するだけです。

手順については、WPBakeryページビルダーで検索ボックスを追加する方法に関するガイドをご覧ください。
4. Breakdance
Breakdanceは、その速度とユーザーフレンドリーなワークフローで知られるモダンなビルダーです。
Breakdanceデザインに機能的な検索フォームを追加することは、訪問者が探しているものを正確に見つけられるようにするための簡単なプロセスです。

このガイドに従って、Breakdanceで検索フォームを作成する方法を詳しく知ることができます。
5. Beaver Builder
Beaver Builderは最も人気のあるページビルダーの1つであり、ページの構築に信頼性が高くクリーンなインターフェイスを提供します。
これが好みのツールである場合、組み込みモジュールを使用して、SearchWPと完全に互換性のある検索フォームを表示できます。

Beaver Builderを使用して検索フォームを追加する方法に関するすべての詳細については、このガイドに従ってください。
6. Bricks Builder
Bricksは、開発者の間で人気が高まっているパフォーマンス重視のビルダーです。
サイトのナビゲーションとユーザーエクスペリエンスを向上させるために、Bricksテンプレートに検索フォームを簡単に挿入できます。

詳細については、Bricksを使用してWordPressで検索フォームを追加する方法に関するガイドに従ってください。
7. Divi
Diviは、サイトのテーマの広範なカスタマイズを可能にする強力なビジュアルビルダーです。
検索バーを追加するだけでなく、SearchWPは検索結果ページまで、エクスペリエンス全体をカスタマイズするのに役立ちます。
ページ上のどこにでもSearchWPフォームモジュールを追加し、検索フォームをすばやく選択するだけです。

すべての手順は、Diviの検索結果ページテンプレートの作成方法に関するガイドに記載されています。
ボーナス:WordPressナビゲーションメニューに検索ボックスを追加する
サイトのナビゲーションメニューに検索ボックスを追加することもできます。
訪問者にとってより見やすくなり、検索を実行するように促します。

詳細については、WordPressメニューに検索バーを追加する方法のステップバイステップチュートリアルをご覧ください。
訪問者がサイトでコンテンツを検索するための、より便利な方法を提供できるようになることを願っています。
この記事が、ページに検索ボックスを簡単に追加する方法を学ぶのに役立ったことを願っています。また、Elementorページに検索ボックスを追加する方法やWordPressで投稿コンテンツを検索する方法に関するガイドも参照してください。
スマート検索ボックスを作成してページに追加する準備はできましたか?ここからSearchWPを開始できます。


