Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WordPressで検索結果ページをカスタマイズする方法

WordPressには検索機能がビルトインされているが、その検索結果はかなり悪いことが多い。これが、私たちが自分のサイトで初期設定のWordPress検索を使うのをやめた主な理由のひとつだ。

幸いなことに、検索結果ページをユーザーフレンドリーにカスタマイズすることができる。必要なのは、適切なWordPressプラグインだけだ。私たちの経験では、SearchWPは初心者にやさしく、カスタマイザーの設定も豊富なので、この仕事をこなすのに最適なツールです。

検索結果ページをカスタマイザーすることで、ユーザーがより簡単に目的のコンテンツを見つけることができることを、私たちは身をもって知っています。また、ユーザーエクスペリエンスも向上し、ページ表示やコンバージョンの増加につながります。

そこでこの投稿では、コードを書かずにWordPressの検索結果ページをカスタマイズする方法を紹介する。私たちのガイドに従って、訪問者により良い検索体験を提供してください。

Customizing WordPress search results page

なぜWordPressの検索結果ページをカスタマイズするのか?

ストレートにお伝えします。WordPressの初期設定の検索機能は良くない!

WordPressの各サイトには、非常に基本的な検索機能がついている。ユーザーが検索キーワードに一致するコンテンツを探す権限がありますが、検索結果はあまり良くありません。

No results found for a search term in WordPress

ユーザーのクエリに答えそうな一致がいくつかあっても、検索キーワードが結果を返さないことがよくある。

検索自体も遅く、ページの読み込みが必須です。複数のユーザーが一度に検索機能を使用すると、サイトの表示速度が低下する可能性があります。

検索体験が悪ければ、ユーザーは他を探すようになり、潜在的なカスタマイザーや購読者を失うことになります。私たちのサイトでは、サイト内検索のようなコンテンツ発見機能によってページビューが大幅に増加するのを目の当たりにしてきました。

幸いなことに、WordPressはカスタマイズが可能なので、より良い検索体験をサイトに自由に追加することができる。

Search results found

より良いユーザーエクスペリエンスと、より役立つ検索結果を備えた、より高速な検索システムを構築する方法をご紹介します。

WordPressで検索結果ページを編集する方法

コードを書かずにWordPressの検索結果ページを簡単に編集する方法をご紹介します。

さらに、初期設定の検索をより強力なソリューションに置き換えて、検索結果の質を向上させる方法も詳しく学びます:

さあ、飛び込もう!

ステップ1: SearchWPをWordPressの検索エンジンに設定する

SearchWPは、市場で最高のWordPress検索プラグインです。

より高速で正確な検索エンジンに置き換えることで、WordPressの検索を有効化します。

SearchWP

WordPressの検索をカスタマイズするためにSearchWPを使用するのはなぜですか?

  • 初期設定のWordPress検索とは異なり、SearchWPはバックグラウンドで自動的にコンテンツをインデックス化し、検索クエリーの実行を高速化します。
  • WordPressの初期設定の検索フォームとテンプレートで動作します。つまり、コードを書いたり、サイトに大きな変更を加えたりする必要はありません。
  • その強力な検索機能は、投稿タイトル、抜粋、コンテンツ、カテゴリー、タグ、ページなどの一致を検索します。これにより、検索結果の質が即座に向上します。

詳細については、長所と短所と私たちの完全なSearchWPレビューを参照してください。

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

有効化したら、SearchWP ” 設定ページにアクセスし、’一般’タブに切り替える必要があります。SearchWPのウェブサイト上のあなたのアカウントにあるプラグインのライセンスキーを入力してください。

Enter SearchWP license key

次に、SearchWP ” Algorithmページにアクセスして、検索エンジンの設定を行う必要があります。

SearchWPがあなたのために初期検索エンジンを設定していることに気づくだろう。WordPressの投稿、ページ、メディアをソースとして使用します。

SearchWP search engines

各ソースの下で、スライダーを調節して、ある属性を他の属性よりも重視することができます。

検索結果にあなたのサイト上のより多くの場所を含めたいですか?ソースと設定」ボタンをクリックして追加してください。

Add sources to search engine

このチュートリアルのために、検索ソースとして「コメント」を追加してみよう。

Done』をクリックすると、ソースリストの下に新しいタブが表示される。しかし、このタブは空である。このタブを使いやすくするには、「属性の追加と削除」ボタンをクリックする必要がある。

Add attributes

どの属性を検索に含めるかを選択するポップアップが表示されます。

例えば、「コメントする」テキストを属性として選んだ。

Select attributes to add into search source

属性を追加した後、検索結果でその属性に重みを割り当てることができます。

重みが増すということは、SearchWPが検索結果を表示する際に、その属性を他の属性よりも関連性が高いとみなすことを意味します。

Attribute weight in search results

ソースにさらに属性を追加する必要がある場合は、このプロセスを繰り返すだけです。

検索ソースの確認が終わったら、「保存」ボタンをクリックします。

Save search engine settings

SearchWPはあなたの設定に基づいて検索インデックスの構築を開始します。

終了すると、「インデックスの状態」として100%と表示されます。

Search index status in SearchWP

SearchWPエンジンは、初期設定のWordPress検索を自動的に置き換えます。すでにあなたのサイトに検索フォームがある場合は、それを試すことができます。

サイトに検索フォームがない場合は、外観 ” ウィジェットページから追加できます。

検索」ウィジェットまたはブロックをサイドバーに追加し、「更新」ボタンをクリックして変更を保存するだけです。

Add a search widget block

注:WordPressテーマにウィジェット対応エリアがない場合、「外観」メニューの「ウィジェット」ページは表示されません。

代わりに、外観 ” エディターページにアクセスしてサイトに検索ブロックを追加することができます。

Search block in site editor

これで完全なサイトエディターが起動します。検索’ブロックを検索フォームを表示したい任意の場所に追加することができます。

WordPressブログにアクセスして、新しくなった検索機能をお試しください。

ステップ 2: WordPressサイトに高度な検索フォームを作成する

何の変哲もない検索フォームは、見た目には問題なく、仕事もこなせる。しかし、あまり魅力的ではなく、ユーザーはサイト上でそれに気づかないことも多い。

SearchWPは、WordPressサイトに非常に便利で高度な検索フォームを作成できるようにすることで、この問題を解決します。

SearchWP ” Search Formsページに行き、’新規追加’ボタンをクリックするだけです。

Search forms in SearchWP

次の画面で、フォーム名の横にある鉛筆のアイコンをクリックして、適切な名前を付けます。

これにより、後でサイトにフォームを追加する必要があるときに、フォームを認識しやすくなります。

Give your form a name

その後、検索フォームのテーマを選択する必要があります。

SearchWPには、「基本」、「カテゴリー検索」、「クイック検索」、「詳細」、「複合」検索フォームなど、いくつかのオプションが用意されている。

Search form themes

テーマをクリックすると、そのテーマが選択され、検索フォームのプレビューが表示されます。

検索フォームに使いたいテーマを選び、スクロールダウンしてカスタマイズするだけです。

Customize your search form

ここからフォームの調整、フォームのスタイル、色の選択ができます。

設定が完了したら、忘れずに「保存」ボタンをクリックして設定を保存してください。

Save search form

このカスタマイザーは初期設定のWordPress検索フォームを自動的に置き換えるものではありません。

代わりに、手動でサイトに埋め込む必要があります。外観 ” ウィジェットページ(WordPressテーマにサイドバーがない場合は外観 ” エディター)にアクセスするだけです。

ここから、サイトエディターのウィジェットエリアまたはテンプレートに「検索フォーム」ブロックを追加する必要があります。

Search form block

その後、ブロック内のドロップダウンメニューから、先ほど作成したフォームを選択します。

画面にカスタム検索フォームのプレビューが表示されます。

Advanced form displayed

保存」または「更新」ボタンをクリックして、変更内容を保存することをお忘れなく。

ステップ3:重要なコンテンツを促進するために検索結果を調整する

初期設定のWordPress検索をSearchWPに置き換えたところで、さらに優れた検索結果を生成する方法を見ていきましょう。

私たちは、検索結果で重要なコンテンツを宣伝することから始めます。より多くの収益をもたらすブログ投稿、セールスページリードジェネレータのランディングページなどです。

まず、SearchWP ” Extensionsのページにアクセスし、Custom Results Orderエクステンションをインストールする必要があります。

Custom Results Order extension for SearchWP

次に、SearchWP ” Statisticsページにアクセスする必要があります。

ここでは、ユーザーの間で人気のある検索キーワードを見ることができます。

SearchWP statistics

注:プラグインをインストールしたばかりの場合は、ここに十分なデータがない可能性があります。より多くのデータを収集するために、ユーザーがいくつかの検索キーワードを入力するのを待つことができます。

次に、検索結果で特定の投稿やページを宣伝したいキーワードを探します。

その後、SearchWP ” Algorithmページに行き、’Custom Results Order’ タブを選択する。

Add custom results order

検索クエリーボックスの中に、宣伝したい投稿やページのキーワードを入力し、「検索クエリーを追加」ボタンをクリックします。

SearchWPは、特定のクエリーの結果を表示します。宣伝したいコンテンツを選択し、「トップに宣伝」ボタンをクリックする必要があります。

Promote to top

選択した投稿やページは、特定の検索キーワードで上位に表示されるようになります。

同じページに戻り、「プロモーションを削除」ボタンをクリックするか、別のプロモーションを追加することで、いつでもその投稿やページをトップから外すことができます。

Promoted search result

ステップ4:WordPressの検索結果からコンテンツを除外する

検索結果に表示させたくないコンテンツがある場合があります。例えば、期限切れの販売イベントや古いブログ投稿を宣伝するページがあるかもしれません。

SearchWPでは、検索結果に含めたくない投稿やページを簡単に除外することができる。

まず、SearchWP ” 拡張機能のページにアクセスし、’Exclude UI’拡張機能をインストールする必要があります。

Exclude UI extension

有効化した後は、検索結果から除外したい投稿やページを編集するだけです。

編集画面の「投稿」パネルに、その投稿を検索結果から除外するオプションが表示されます。

Exclude post from search results

検索から除外する」にチェックを入れ、「更新」ボタンをクリックして変更を保存します。

SearchWPはその投稿やページを検索結果に表示しないようにします。

ステップ5:WordPressで検索結果が即座に外観されるようにする

通常、SearchWPの検索結果はWordPressテーマが提供するテーマテンプレートファイルを使って表示されます。

しかし、ユーザーが入力を始めるとすぐに結果を表示できるとしたらどうだろう?この機能はライブ検索と呼ばれ、GoogleやBingなどの検索エンジンですでに目にしたことがあるかもしれない。

WordPressサイトにライブ検索を追加して、検索をユーザーにとってより良い体験にしましょう。

まず、SearchWP ” 拡張機能のページにアクセスし、’Live Search’ 拡張機能をインストールする必要があります。

Install live ajax search

有効化すると、拡張機能は自動的に動作し始めます。

サイトにアクセスし、検索フォームにキーワードを入力し、その動作を確認することができる。

Live search preview

より詳細な手順については、WordPressにライブ検索を追加する方法のチュートリアルを参照してください。

ステップ6: WordPressサイトのより多くの場所で検索する

SearchWPは、WordPressサイト上のより多くの場所で検索するように設定することができます。例えば、カスタムフィールド、PDFドキュメント、ショートコード出力などで検索できます。

検索を有効化したい場所に応じて、これらの機能を必要に応じてオン・オフできる。

WordPressカスタムフィールドの検索有効化

WordPressのカスタムフィールドは、WordPressの投稿やページに追加のメタデータを保存することができます。WordPressプラグインも投稿やページに関連するデータを保存するためにカスタムフィールドを使用します。

検索ソースにカスタムフィールドを含めるには、 SearchWP ” Algorithmページに行き、ソースの下にある’Add/Remove Attributes’ボタンをクリックするだけです。

Edit search source attributes

特定のカスタムフィールドを選択するか、任意のメタ情報を選択するポップアップが表示されます。

完了したら「Done」をクリックし、「Save Engines」ボタンを忘れずにクリックしてください。

Include custom fields in search results

SearchWPはカスタムフィールドをソースとして使用するようになり、一致した投稿が検索結果に含まれるようになります。

詳しくは、WordPressでカスタムフィールドを検索可能にする方法をご覧ください。

PDFとドキュメントの検索有効化

SearchWPは、WordPressのメディアライブラリにアップロードされたPDFファイルやオフィスドキュメントの中を検索することもできます。

SearchWP ” Algorithmページに 行き、検索エンジンの’Sources & Settings’ボタンをクリックするだけです。

Search sources and settings

ポップアップが表示されるので、「メディア」がソースの1つとして選択されていることを確認してください。

そして「完了」ボタンをクリックする。

Select media source

その後、エンジン設定ページのソースリストまでスクロールダウンし、「メディア」タブを見つける。

ここから「属性の追加と削除」ボタンをクリックします。

Add media attributes

検索結果にどの属性を含めるかを選択するポップアップが表示されます。

ドキュメントのコンテンツ」、「PDFメタデータ」、「タイトル」属性が選択されていることを確認してください。

Select PDF document attributes

選択後、「完了」ボタンをクリックしてください。

次に、スライダーを上下に動かして、検索結果で特定の属性に与える重みを調整することができます。

設定が完了したら、「Save Engines」ボタンをクリックして設定を保存することをお忘れなく。

Adjust PDF weight

ショートコード出力で検索を有効化する

多くのWordPressプラグインは、WordPressの投稿やページにデータを出力するためにショートコードを使用しています。

このショートコードデータがWordPressサイトにとって重要で、検索結果の改善に役立つのであれば、SearchWPでショートコード出力の解析を有効化することができます。

SearchWP ” 設定ページに行き、一番下にスクロールするだけです。ここから、「ショートコードを解析する」オプションをオンにする必要があります。

Parse shortcodes

その後、’Wake Up Indexer’ボタンをクリックするだけで、検索結果にショートコードの出力を含める新しいインデックス作成プロセスがバックグラウンドで実行されます。

ステップ7:WordPressの検索結果にeコマースを含める

SearchWPは、あなたのオンラインストアのeコマース検索結果を改善するために超簡単になります。

WooCommerceや Easy Digital Downloadsなど、人気のeコマースプラグインとの強力な統合機能を備えています。

WooCommerceストアでこの機能を有効にする方法をご紹介します。他の統合も同様に機能します。

まず、SearchWP ” Extensionsページに行き、WooCommerce Integrationエクステンションをインストールする必要があります。

WooCommerce integration in search results

有効化したら、SearchWP ” Algorithmのページにアクセスします。

次に、検索エンジンの「ソースと設定」ボタンをクリックします。

Search sources and settings

ポップアップが表示されるので、「製品」オプションがソースの1つとして選択されていることを確認します。

その後、「完了」をクリックしてポップアップを終了する。

Add WooCommerce products to search

ソース」画面を下にスクロールすると、「製品」タブが表示されます。

カスタムフィールドや商品カテゴリーを選択するには、スライダーを動かすか、「属性の追加/削除」ボタンをクリックして、属性の重みを調整できます。

Product weight adjusted

設定が完了したら、忘れずに「Save Engines」ボタンをクリックして設定を保存してください。

より詳細な手順については、WordPressでWooCommerceの商品検索を改善する方法のガイドをお読みください。

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.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

アバター

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

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

Reader Interactions

14件のコメント返信を残す

  1. Dennis Muthomi

    I run an online store (selling tshirts on woocommerce) and I’ve struggled with providing a seamless search experience for my customers.
    this guide on customizing the WordPress search results page using SearchWP is a game-changer! the ability to promote important products, exclude outdated ones, and enable live search will significantly improve user experience and conversions.

    I especially appreciate the detailed instructions on integrating WooCommerce for better product search results.
    Thank you!!

  2. THANKGOD JONATHAN

    My search page was an eyesore. This guide transformed it into a user-friendly haven! Now visitors can actually find what they need. Thanks for the design tips!

    • WPBeginner Support

      Glad our guide was helpful :)

      管理者

  3. Ahmed Omar

    Customizing the search results page in WordPress has always been a bit of a puzzle for me, but your step-by-step guide really breaks it down. The use of hooks and filters, as you explained, adds a whole new layer of flexibility to the process.
    Thank you

    • WPBeginner Support

      You’re welcome :)

      管理者

  4. Jiří Vaněk

    Would you eventually consider making such personifications (even just small steps) through tools like Elementor (graphics) or coding (functions)? I understand that the plugin route is very straightforward, but unfortunately, WordPress sometimes becomes like a bottomless pit for plugins, eventually causing significant slowdowns. For instance, I try to customize everything graphically in Elementor since I have it, and when it comes to search, I’ve been considering going the route of Google Search.

      • Jiří Vaněk

        Articles for pagebuilders would be very nice. I think a lot of people use them. Thank you for the article about plugins. I read it and thanks to you I got a new perspective on this matter.

  5. Ram E.

    If your only concern is customizing the appearance of the search results page, this is something one can easily do in full site editing mode—in other words if you are using a block theme (even without a special plugin). But if you want to configure not only the page appearance but also the overall settings/features, SearchWP is indeed a great option.

    • WPBeginner Support

      Not all themes have the option to customize built-in and we hope SearchWP helps those who can and can’t :)

      管理者

  6. Piotr Z

    Imagine your blog is like a big library with lots of cool books. When you started, it was like a tiny library, and finding stuff was easy. But now, it’s grown into a mega-library, and sometimes even you can’t find your favorite book!

    This is what happened to me! Sometimes I cannot even find the article on my own blog.
    It seems like this is the next topic for me to explore and improve.

    thanks a lot for this guide, it is full of practical tips on how I can make my blog more accessible and searchable.

    • WPBeginner Support

      You’re welcome, we hope our recommendations help :)

      管理者

  7. Ralph

    First of all, you should decide is it even worth the time. If you are not really tech savvy it will take a lot of time. I know, because I’m not the best at such things. I’m blogging for a long time and used to think i have to make everything perfect on my site.

    From modifications of my theme, adjusting sizes of images or buttons to even customizing 404 or search. For me personally it was not worth it. I spent a lot of time, and learned that what i had in my theme was in 80% the same. Was that 20% worth hours put in it? You have to decide yourself, but after years i would say no it was not worth it.

    Of course if you can do this in 15 minutes, then go ahead. I personally rather focus on creating another awesome post or guide for my readers.
    I would also do it if I had really big website. More like portal not blog. For professionals, go ahead!

    • WPBeginner Support

      Thanks for sharing your opinion on this and we hope our guides can make the process of making changes take much less time.

      管理者

返信を残す

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