How to add Google Search bar to your website

「ウェブサイトにGoogle検索バーを追加する方法」

Rate this article

Share this article

ウェブサイトにGoogle検索バーを追加することで、ユーザーの閲覧体験を大幅に向上させ、サイトナビゲーションを改善できます。検索バーを使うことで、訪問者は探しているコンテンツをすぐに見つけることができ、これが新規ユーザーが再度ウェブサイトを訪れるための最良のスタートの一つです。したがって、検索機能はウェブサイトをよりユーザーフレンドリー効率的にするための核心です。この方法は、WordPress、Ghost、Drupal、Joomla などの主要なCMSで動作します

Google検索バーをウェブサイトに追加する方法

サイト内検索はウェブサイトにとって重要な技術です。これは、ユーザーがウェブサイト内のコンテンツを検索できるようにし、コンテンツ戦略を再編成して、ウェブサイトで人々が検索しているものに合わせて商品やブログコンテンツを調整するのに役立ちます。Google検索が非常に人気がある理由は、それが実装が簡単で信頼性が高いからです。サイトがGoogleBotにクロールされていると仮定して、以下にGoogle検索バーまたはボックスをウェブサイトに追加するためのステップバイステップガイドと、その機能を最適化するためのベストプラクティスを探ります。

ウェブサイトにGoogle検索バーを追加する

  • ステップ 1: コントロールパネルにGoogleアカウントでサインインします(もちろんGoogleアカウントが必要です)。

開始する

  • ステップ 2: 検索エンジンの名前を入力します。この名前はいつでも変更できます。

Googleサイト検索の作成

  • ステップ 3: 「作成」をクリックし、それで完了です。

    作成完了

これで、基本的な検索エンジンの準備が整いました! 検索機能、UIの外観、Google広告の設定は後で行うことができます。
注意: cse.google.com は旧URLで、コントロールパネルが新しいものです。プレビュー検索へのリンクや基本設定>公開URLが表示されます。: https://cse.google.com/cse?cx=67d0040d2a5004c34

検索デモ

  • ステップ 4: 下記のようにサイトコードを更新します。

<!DOCTYPE html>
<html>
    <head>
    <title>Googleカスタム検索バー</title>
    <style>
        body{ text-align: center; }
        .logo {
            display: block;
            margin: 20px auto;
            box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
            width: 200px; /* 必要に応じて幅を調整 */
        }
        .gcse-search {
            margin-top: 20px;
         }
    </style>
    </head>
    <body>
    <img src=”https://www.expertrec.com/wp-content/uploads/2024/07/logo.png” alt=”Expertrecロゴ”>
    <script async src=”https://cse.google.com/cse.js?cx=67d0040d2a5004c34″></script>
    <div></div>
</body>
</html>

UI出力:
UI出力

Googleカスタム検索を追加する利点

  • Googleカスタム検索は無料です
  • Googleカスタム検索内に広告を有効にすると、AdSenseで収益を上げることができます。

Googleカスタム検索の欠点

  • 広告 – 競合他社に 訪問者を奪われる可能性があります。競合がユーザーのクエリに対して広告を表示する場合。
  • インデックス化されたコンテンツに対するコントロールがないかつ更新されるタイミングも不明です。eコマースサイトでは、検索結果の更新がリアルタイムで行われないため、Google Merchant Feed Updateが設定されるまで。
  • 検索結果に対するコントロールがあまりない
  • 音声検索機能がない
  • リアルタイムでのメールサポートがない
  • UIカスタマイズのオプションが最小限
  • いつでも停止または変更される可能性があります。GoogleはGoogle Search Applianceのように、このサービスを停止するかもしれません。

ウェブサイトにGoogle検索を追加するのは素晴らしいことですが、無料のランチはありません。 Googleはこのサービスを提供するために広告を表示します。たとえば、あなたのサイトがブランドXの靴についてのもので、ユーザーが検索したときにGoogleが競合ブランドYの広告を表示し、あなたのサイトの結果の上に表示することがあります。もし訪問者から収益を上げるつもりなら、これにより収益が大幅に減少するでしょう。

Expertrec検索バーの使用

  1. 広告なし。検索結果に広告は表示されません。
  2. 手頃な価格のプラン。
  3. リアルタイムサポートで、ウェブサイトに検索機能をライブにする手助けをします。
  4. 検索結果に対する完全なコントロール

検索をお楽しみください。こちらが再度サインアップリンクです: https://cse.expertrec.com

広告なしのGoogle検索バーをサイトに追加する

YouTube video

Are you showing the right products, to the right shoppers, at the right time? Contact us to know more.
You may also like