「JSON-LD」を設置して、サイトリンク検索ボックスを表示！

サツキ: トリック or トリート！とりあえずお菓子ください。

皆さん、こんにちは。サツキです。

今回は検索結果の一覧画面にて自身のサイトのサイトリンク検索ボックスを表示させるための「JSON-LD」での構造化データを実装する方法について説明したいと思います。
※実際に表示されるかどうかはGoogle側の判断によるため必ずサイトリンク検索ボックスが表示されるという保証はありません。

以前の記事に興味がある方は以下のURLより御覧ください。
「JSON-LD」でパンくずリストの構造化データを実装【WP設置編】

「JSON-LD」でパンくずリストの構造化データを実装【カスタマイズ編】

「JSON-LD」でFAQの構造化データを実装

「JSON-LD」で組織情報の構造化データを実装

そもそも設置するメリットは？

サイトリンク検索ボックスを表示させることができれば、ユーザーは検索結果の一覧画面から直接サイトやアプリを検索でき、時間を節約することができます。
また、検索ボックスにはリアルタイムのおすすめやその他の機能が実装されますのでよりユーザーに対して希求力を上げられるかもしれません。
ですので可能であれば設置することをオススメいたします。

サイトリンク検索ボックスを表示させるための「JSON-LD」の構造化データの記述方法

  例）SAMPLE 構造化データ
  <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "WebSite",
      "name": "サイト名",
      "url": "サイトURL",
      "inLanguage": "jp", // WEBサイトの言語
      "potentialAction": {
        "@type": "SearchAction",
        "target": {
          "@type": "EntryPoint",
          "urlTemplate": "https://query.example.com/search?q={search_term_string}"
        },
        "query-input": "required name=search_term_string"
      }
    }
  </script>

またandroidアプリの場合には少し記述を追加して以下のように記述します。

  例）SAMPLE 構造化データ
  <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@type": "WebSite",
      "name": "サイト名",
      "url": "サイトURL",
      "inLanguage": "jp", // WEBサイトの言語
      "potentialAction": [{
          "@type": "SearchAction",
          "target": {
            "@type": "EntryPoint",
            "urlTemplate": "https://query.example.com/search?q={search_term_string}"
          },
          "query-input": "required name=search_term_string"
        },
        // 以下を追記
        {
          "@type": "SearchAction",
          "target": {
            "@type": "EntryPoint",
            "urlTemplate": "android-app://com.example/https/query.example.com/search/?q={search_term_string}"
          },
          "query-input": "required name=search_term_string"
        }
      ]
    }
  </script>

「urlTemplate」には、「ウェブサイトの場合は、検索クエリを受け取って処理するハンドラのURL。アプリの場合は、クエリを処理する検索エンジンのインテントハンドラの URI」とGoogleのガイドラインに説明があります。

正しく設置できているかの確認方法

リッチリザルトテストのサイトで以下の方法でコードの検証ができます。

① テストするページのURLを入力して検証

② 直接テストするコードを貼り付けた上で検証

テスト自体は無料で、時間もかからないため実装後にはテストして構造化データが正しく設定できていることを確認することをオススメいたします。

まとめ

以上が、サイトリンク検索ボックスを表示させるための「JSON-LD」の構造化データの記述方法となります。
「例）SAMPLE 構造化データ」をコピーしていただいてサイト名やURLを変更いただくだけで、特に難しいということもないかと思いますので皆さんもご自身のサイトに実装してみてはいかがでしょうか？

それでは今回も最後までお付き合いありがとうございました。

コラム