読者から最もよく寄せられる質問の1つは、ショートコードを使用して特定のページまたは投稿に検索バーを追加できるかどうかということです。
通常、WordPressサイトの検索バーは、サイトナビゲーションメニューまたはサイドバーにあります。
しかし、ショートコードを使用すると、投稿やページの中に直接検索バーを配置できます。そしてSearchWPを使用すると、検索エクスペリエンスを次のレベルに引き上げ、ユーザーが探しているものをより迅速に見つけるのに役立ちます。
この記事では、WordPressサイトにショートコードを使用して検索バーを追加する方法を説明します。
WordPressでショートコードを使用して検索バーを追加する理由
通常、検索バーを追加できる場所はあまり多くありません。
ほとんどのWordPressテーマでは、検索バーをウィジェットエリアのウィジェットとして配置できます。ナビゲーションメニューの横に検索バーを表示することもできます。
しかし、検索バーを含むページを作成したい場合はどうでしょうか？または、読者が何かを検索したいときに読書を中断する必要がないように、記事の中に検索バーを配置したい場合はどうでしょうか？
そこでショートコードが役立ちます。ショートコードを使用すると、投稿またはページ内の任意の場所に検索バーを自由に追加できます。
これは、テーマが検索ボックスの追加をサポートしておらず、コードを編集して追加したくない場合に役立ちます。
それでは、ショートコードを使用してサイトに検索バーを追加する方法を見てみましょう。
ショートコードでWordPressの検索バーを追加する
ショートコードでWordPressの検索バーを追加する最も簡単な方法は、SearchWPを使用することです。
Search WPは、最も強力で包括的なWordPress検索プラグインです。すでに50,000以上のウェブサイト所有者がこれを使用して、訪問者に正確な検索結果を提供しています。
このプラグインは、ショートコードで検索バーを追加できるだけでなく、WordPress検索エンジンを完全に制御することもできます。
たとえば、SearchWPを使用すると、検索結果の順序をカスタマイズしたり、ドキュメント、メディアファイル、製品の詳細、PDF、カスタムフィールドなどを検索可能にしたりできます。
このプラグインは、サイト上のすべての検索バーと自動的に統合されます。そのため、インストール後すぐにサイト検索を強化でき、コーディングは不要です。
SearchWPでできるその他の便利な機能の一部を次に示します。
- カスタムフィールドのインデックス作成：多くのWordPressプラグインはカスタムフィールドを使用してデータを保存しますが、ネイティブのWordPress検索エンジンは検索中にそれらを考慮しません。SearchWPを使用すると、サイトでカスタムフィールドを検索可能にできます。
- 検索追跡：訪問者がサイトでどのような検索を行っているか疑問に思ったことはありませんか？SearchWPは、数回のクリックでサイトの検索アクティビティに関する洞察を提供するため、新しいコンテンツのアイデアを得て、オーディエンスのニーズを満たすことができます。
- シームレスなWooCommerce連携: デフォルトでは、WordPressの検索はWooCommerceの商品詳細を無視するため、お客様が探している商品を見つけにくくなります。SearchWPを使用すると、商品属性、タグ、レビューを含む、あらゆるWooCommerceカスタムフィールドを検索可能にできます。
SearchWPを使用して、数分でショートコード付きの検索バーを追加する方法を見てみましょう。
ステップ1：SearchWPプラグインのインストールと有効化
最初のステップは、SearchWPのウェブサイトにアクセスし、新規アカウントにサインアップすることです。
完了したら、SearchWPアカウントに移動し、「ダウンロード」タブに切り替える必要があります。ここから、「SearchWPをダウンロード」ボタンを押すだけで、プラグインZIPファイルをコンピューターに保存できます。
ダウンロードが完了したら、ライセンスキーをコピーしてください。後でプラグインを有効化する際に必要になります。
SearchWPをダウンロードし、ライセンスキーをコピーしたら、プラグインZIPファイルをWordPressサイトにアップロードしてSearchWPをインストールしてください。
その方法についてサポートが必要な場合は、WordPressプラグインのインストール方法に関するステップバイステップガイドをご覧ください。
SearchWPがインストールされ有効化されると、セットアップウィザードが表示されます。「オンボーディングウィザードを開始」ボタンをクリックして、画面の指示に従ってください。
ステップ2：ショートコード拡張機能のインストールと有効化
次に、SearchWPでショートコード拡張機能をインストールする必要があります。この拡張機能により、投稿やページの任意の場所にショートコードで検索バーを追加できます。
まず、「SearchWP » 拡張機能」ページに移動し、「ショートコード」拡張機能を見つけます。ここから、「インストール」ボタンをクリックするだけで、拡張機能がサイトに自動的に有効化されます。
ステップ3：新しい検索バー用のページを作成する
次に、検索ボックスを配置する新しいページを作成する必要があります。
これを行うには、WordPressダッシュボードから「ページ」に移動し、「新規追加」ボタンをクリックするだけです。
WordPressコンテンツエディターに入ったら、ページにタイトルを追加してください。
その後、「プラス」ボタンをクリックし、「カスタムHTML」ブロックを検索してクリックし、ページに追加します。
次に、以下のコードをコピーして「カスタムHTML」ブロックに貼り付けます：
[searchwp_search_form engine="default" var="searchvar" button_text="Find Results"]
<div class="search-results-wrapper">
[searchwp_search_results engine="default" var="searchvar" posts_per_page=4]
<h2>[searchwp_search_result_link direct="true"]</h2>
[searchwp_search_result_excerpt]
[/searchwp_search_results]
</div>
<div class="no-search-results-found">
[searchwp_search_results_none]
No results found, please search again.
[/searchwp_search_results_none]
</div>
<div class="search-results-pagination">
[searchwp_search_results_pagination direction="prev" link_text="Previous" var="searchvar" engine="default"]
[searchwp_search_results_pagination direction="next" link_text="Next" var="searchvar" engine="default"]
</div>
上記のコードは、カスタムHTMLボックスを追加したページに検索ボックスを表示します。
また、検索結果がない場合は「検索結果が見つかりませんでした」というメッセージが表示されます。さらに、4件以上の検索結果がある場合はページネーションリンクも表示できます。
コードを追加したら、右上にある「公開」ボタンをクリックしてページを公開してください。
それでは、新しいページに移動して、追加した検索バーをテストしてみましょう。
ステップ4：新しい検索バーをテストする
新しく作成したページに移動するには、「ページを表示」ボタンをクリックします。
ご覧のとおり、ショートコードで追加した検索バーがページに正常に表示されています。
さまざまなブログ投稿やページを検索して、検索バーをテストしてみてください。
ボーナス：デフォルトのWordPress検索設定を変更する
SearchWPを使用すると、デフォルトのWordPress検索設定を変更し、訪問者全体の検索エクスペリエンスを向上させることができます。
デフォルトの検索には多くの制限があり、コンテンツや製品が多いサイトには理想的ではありません。たとえば、検索を実行する際にカスタムフィールド、製品詳細、カテゴリ、タグ、その他の追加情報が含まれません。
ここでSearchWPを使用して検索設定を変更できます。このプラグインを使用すると、検索結果にコメント、レビュー、タクソノミー、カスタムフィールドなどを含めることができます。
SearchWPでは、無制限のカスタム検索エンジンを作成することもでき、サイト上の複数の検索フォームにリンクできます。
詳細については、WordPressサイトのデフォルトの検索設定を変更する方法に関するガイドを参照してください。
この記事が、ショートコードでWordPressの検索バーを追加する方法を学ぶのに役立ったことを願っています。また、WordPressウェブサイトに検索バーを追加する方法やWordPressサイトを検索する検索バーを作成する方法に関するガイドも参照してください。
よりパーソナライズされた優れたWordPress検索エクスペリエンスを作成する準備はできましたか？今すぐ SearchWP を使い始めましょう！
