この記事では、商品データ用に構造化データのマークアップを実装する方法を説明します。
- 最初に、Merchant Center 用の構造化データのマークアップについてのページを確認して、自分のサイトが要件を満たしていることをご確認ください。
- Merchant Center の商品データの枠を超えた、構造化データの一般的なガイドラインについては、schema.org のスタートガイドをご覧ください。Search Console を使用して、構造化データに関連した問題のトラブルシューティングを行うことや、サイトの検索トラフィックと検索パフォーマンスを測定することもおすすめします。
- 詳しくは、Google 検索における Product の構造化データに関する記事、特に販売者リスティングの各セクションをご覧ください。
このページの内容
はじめに
構造化データのマークアップをウェブサイトに追加するには、自分のサイトの HTML またはショップのシステムのテンプレートの設定にアクセスして編集できる必要があります。マークアップは HTML タグのアノテーションであり、検索エンジンのクローラやボットに、自分のサイトに商品データがあることを知らせ、システムが確実にデータを理解できるようにします。
Google のクローラが構造化データと商品データを照合するには、次の条件のいずれかを満たしている必要があります。
- ランディング ページに商品が 1 つだけ存在すること。
- ページ全体に複数の商品が存在する場合、ページ内の各商品に SKU や GTIN が割り当てられており、それぞれの Google ショッピングの商品データに同じ SKU（ID
[id]属性）または GTIN（GTIN[gtin]属性）が指定されていること。これは、同一のランディング ページに同じ商品のさまざまなバリエーション（サイズ違いや色違いや関連商品など）を表示する場合に便利です。
少なくとも 1 つの条件が満たされていない場合、ランディング ページの商品は商品データと一致しません。
ウェブサイトに構造化データのマークアップを設定する方法について詳しくは、schema.org のスタートガイドをご覧ください。schema.org の機械が理解できる情報のバージョンのセクションで、構造化データの理解と明確化に関する情報を確認できます。
構造化データのマークアップの追加
サイトに構造化データのマークアップを追加するには、JSON-LD として HTML マークアップに追加することをおすすめします。詳しくは、Google 検索における構造化データのマークアップの概要をご覧ください。
JSON-LD マークアップは、ユーザーに表示されるコードとは異なるため、維持が簡単になります。Google 専用に設計されているすべての構造化データのマークアップは、サイトの視覚要素を一切変えることなく追加できます。
サイトで e コマース プラットフォームを使用している場合は、構造化データを追加する前にプラットフォームのテンプレートやコードに変更を加える必要がある場合があります。また、テンプレートやページレベルで適用できるよう、サイトが JavaScript に対応している必要があります。
例
JSON-LD
{
"@context": "https://schema.org/",
"@type": "Product",
"sku": "trinket-12345",
"image": "https://www.example.com/trinket.jpg",
"name": "素敵なアクセサリー",
"description": "クリーンなラインが描かれたアクセサリー",
"gtin": "12345678901234",
"brand": {
"@type": "Brand",
"name": "MyBrand"
},
"offers": {
"@type": "Offer",
"url": "http://www.example.com/trinket_offer",
"itemCondition": "https://schema.org/NewCondition",
"availability": "https://schema.org/InStock",
"price": "39.99",
"priceCurrency": "USD"
}
追加された構造化データのマークアップは、HTML ソースのあらゆる場所に表示されます。追加されたマークアップはすべて、ウェブサーバーから返される HTML に含める必要があり、ページが読み込まれた後に JavaScript を使用して生成することはできません。
Product と Offer
ランディング ページには、商品について説明する Product オブジェクトと、商品の販売方法について説明する、offer フィールド内にネストされた Offer オブジェクトを含める必要があります。
価格の小数点記号はカンマではなくピリオドを使用する必要があることにご注意ください。ランディング ページで複数の通貨の価格を表示する場合は、タイプが Offer である複数のオブジェクトを使用します。複数の Offer オブジェクトを使用する際は、通貨を指定するために priceCurrency 属性も使用する必要があります。
ランディング ページに販売価格が表示されていて、その時点でこの価格がユーザーが実際に支払う価格である場合、販売価格を構造化データに設定するようにしてください。
重要: 一部の商品仕様の属性は schema.org でサポートされていません。商品アイテムの自動更新を行うには、schema.org の price、priceCurrency、availability、condition の値を指定する必要があります。詳しくは、サポートされている構造化データのデータ属性をご覧ください。
マークアップのテスト
Search Console またはリッチリザルト ツールを使用して schema.org の実装をテストします。ツールの使用、問題のデバッグ、ツールでの結果の解釈について詳しくは、Google Search Console ヘルプセンターをご覧ください。