この記事では、商品データ用に構造化データのマークアップを実装する方法を説明します。
- 最初に、Merchant Center 用の構造化データのマークアップについてのページを確認して、自分のサイトが要件を満たしていることをご確認ください。
- Merchant Center の商品データの枠を超えた、構造化データの一般的なガイドラインについては、schema.org のスタートガイドをご覧ください。Search Console を使用して、構造化データに関連した問題のトラブルシューティングを行うことや、サイトの検索トラフィックと検索パフォーマンスを測定することもおすすめします。
- 詳しくは、Product の構造化データに関する記事、特に販売者リスティングの各セクションをご覧ください。
このページの内容
はじめに
構造化データのマークアップをウェブサイトに追加するには、自分のサイトの HTML またはショップのシステムのテンプレートの設定にアクセスして編集できる必要があります。マークアップは HTML タグのアノテーションであり、検索エンジンのクローラやボットに、自分のサイトに商品データがあることを知らせ、システムが確実にデータを理解できるようにします。
Google のクローラが構造化データと商品データを照合するには、次の条件を満たしている必要があります。
- ランディング ページに商品が 1 つだけ表示されていること。
- ページ全体に複数の商品が存在する場合、ページ内の各商品に SKU や GTIN が割り当てられており、それぞれの Google ショッピングの商品データに同じ SKU（ID
[id]属性）または GTIN（GTIN[gtin]属性）が指定されていること。これは、同一のランディング ページに同じ商品のさまざまなバリエーション（サイズ違いや色違いや関連商品など）を表示する場合に便利です。 - 構造化データのマークアップは、ウェブサーバーから返される HTML に含まれている必要があります。ページが読み込まれた後に JavaScript で構造化データのマークアップを生成することはできません。
- 価格などのランディング ページの内容を、IP アドレスやブラウザの種類などのユーザー情報に基づいて動的に変更することはできません。
- 構造化データは、ユーザーに表示される値と一致する必要があります。商品のランディング ページに不正確なデータを掲載すると、Google のウェブ デベロッパー向けガイドラインへの違反となります。
少なくとも 1 つの条件が満たされていない場合、ランディング ページの商品は商品データと一致しません。
schema.org の機械が理解できる情報のバージョンのセクションで、構造化データの理解と明確化に関する情報を確認できます。
構造化データのマークアップの追加
JSON-LD マークアップ
サイトに構造化データのマークアップを追加するには、JSON-LD として HTML マークアップに追加することをおすすめします。詳しくは、Google 検索における構造化データのマークアップの概要をご覧ください。
JSON-LD マークアップは、ユーザーに表示されるコードとは異なるため、維持が簡単になります。Google 専用に設計されているすべての構造化データのマークアップは、サイトの視覚要素を一切変えることなく追加できます。
サイトで e コマース プラットフォームを使用している場合は、構造化データを追加する前にプラットフォームのテンプレートやコードに変更を加える必要がある場合があります。また、テンプレートやページレベルで適用できるよう、サイトが JavaScript に対応している必要があります。
例
JSON-LD
{
"@context": "https://schema.org/",
"@type": "Product",
"sku": "trinket-12345",
"image": "https://example.com/trinket.jpg",
"name": "素敵なアクセサリー",
"description": "クリーンなラインが描かれたアクセサリー",
"gtin": "12345678901234",
"brand": {
"@type": "Brand",
"name": "MyBrand"
},
"offers": {
"@type": "Offer",
"url": "http://example.com/trinket_offer",
"itemCondition": "https://schema.org/NewCondition",
"availability": "https://schema.org/InStock",
"price": "39.99",
"priceCurrency": "USD"
}
追加された構造化データのマークアップは、HTML ソースのあらゆる場所に表示できますが、最善の結果を得るには商品の構造化データを最初の HTML に入れることをおすすめします。
Product と Offer
ランディング ページには次の両方が含まれている必要があります
価格の小数点記号はカンマではなくピリオドを使用する必要があることにご注意ください。ランディング ページで複数の通貨の価格を表示する場合は、タイプが Offer である複数のオブジェクトを使用します。複数の Offer オブジェクトを使用する際は、通貨を指定するために priceCurrency 属性も使用する必要があります。
ランディング ページに販売価格が表示されていて、その時点でこの価格がユーザーが実際に支払う価格である場合、販売価格を構造化データに設定するようにしてください。
重要: 一部の商品仕様の属性は schema.org でサポートされていません。商品アイテムの自動更新を行うには、schema.org の price、priceCurrency、availability、condition の値を指定する必要があります。詳しくは、Google 検索セントラルの販売者のリスティング（商品、商品情報）の構造化データをご覧ください。
マークアップのテスト
Search Console またはリッチリザルト ツールを使用して schema.org の実装をテストします。ツールの使用、問題のデバッグ、ツールでの結果の解釈について詳しくは、リッチリザルト テストまたは Google Search Console ヘルプセンターをご覧ください。
商品ページ（店舗の在庫状況を含む）に必要な構造化データ
商品ページ（店舗の在庫状況を含む）を使用するローカル在庫広告を有効にしている場合は、下の表にある追加の構造化データ マークアップをネスト構造の Offer に追加して、商品がどの実店舗で販売されているかを示すことができます。
注: Schema.org マークアップは、どの言語で書かれたウェブページでも使用できます。マークアップは HTML と同様に英語で記述されます。Schema.org の値は大文字と小文字が区別されます。
| Schema.org の値 | 商品 / 在庫フィード仕様の値 | 値のタイプ |
| Product > offers > availableAtOrFrom > branchCode | store_code [店舗コード] |
各ローカル店舗を識別する英数字の固有 ID です。ビジネス プロフィールで指定した店舗コードと同じ店舗コードを使用する必要があります。 |
店舗受け取りサービスに必要な構造化データ
商品ページ（店舗の在庫状況を含む）と「後日店舗受取可」または「本日店舗受取可」を使用するローカル在庫広告を有効にしている場合は、下の表から追加の構造化データ マークアップをネスト構造の Offer に追加して、商品をどの実店舗で受け取ることができるかを示すことができます。
注: Schema.org マークアップは、どの言語で書かれたウェブページでも使用できます。マークアップは HTML と同様に英語で記述されます。Schema.org の値は大文字と小文字が区別されます。
| Schema.org のプロパティ | 商品 / 在庫フィード仕様の値 | 値のタイプ |
| Product > offers > availableDeliveryMethod | -- | OnSitePickup: 店舗受け取りサービスを利用できる商品であることを意味します。 |
| Product > offers > potentialAction | pickup_method [受け取り方法] |
schema.org の値 BuyAction は、商品のオンラインでの購入と店舗受け取りが可能ことができることを意味します。schema.org の値 ReserveAction は、商品のオンラインでの予約と店舗受け取りが可能であることを意味します。 |
| Product > offers > deliveryLeadTime | pickup_sla [受け取りに関するサービスレベル契約] |
配達リードタイムは 1 または 0 にする必要があります。店舗で受け取れるようになるまでの推定日数を次の値で示します。 0 = 同日 1 = 翌日 |
詳しくは、Merchant Center 用の構造化データについてをご覧ください。