Schema対応のウェブサイトビルダーを使って、商品情報にマークアップを設定するには？

商品ページに名称、画像、価格を記載していても、検索エンジンがそれぞれの内容を正確に識別できるとは限りません。Schemaに対応したウェブサイト構築ツールを使えば、ページ内の商品項目を構造化データにマッピングし、公開後のページを検証できます。まず、ツールがProductマークアップを出力できることを確認し、ページと一致する情報を入力してから、コードと検索エンジンによる認識状況を確認します。

作業時には、「ページ上で商品情報を確認できること」と「ページが有効なマークアップを出力していること」を区別する必要があります。前者は訪問者が情報を読みやすくするもので、後者は検索エンジンが内容を理解するのに役立ちます。マークアップが有効でも、検索結果に価格や在庫などのリッチリザルトが必ず表示されるわけではありません。

まず、ウェブサイト構築ツールの対応範囲を確認する

Schema-ready website builder の使い方を調べる際は、まずツールの商品エディター、SEO設定、または構造化データ設定を確認します。一般的な対応方法は2つあります。1つは、商品テンプレートが名称や価格などの項目からマークアップを自動生成する方法、もう1つは、ページにカスタムJSON-LDを追加できる方法です。具体的な設定場所や権限は使用するツールによって異なるため、すべてのプラットフォームに同じボタンがあると想定しないでください。

公開済みの商品ページをブラウザーで開き、ウェブページのソースコードを表示して、application/ld+json と Product を検索します。該当する内容が見つかったら、ウェブサイト全体やパンくず情報だけではなく、現在の商品に対応しているか確認します。JSON-LDが見つからなくても、ただちにマークアップがないと判断することはできません。ページで別の構造化データ形式が使われていたり、スクリプトで動的に生成されていたりする可能性があるため、テストツールも併用して確認してください。

ツールに商品項目のマッピング機能もカスタムコードの追加機能もない場合は、まず他の対応済みの連携方法があるか確認してください。保守できないページコードを変更してまでマークアップを追加しないでください。

商品情報を整理してから項目をマッピングする

単一の商品詳細ページを例に、まずページに実際に表示する情報を整理します。名称、説明、画像は同じ商品を指すようにします。価格、通貨、在庫状況は、そのページで訪問者が確認できる実際の販売条件を反映する必要があります。ウェブサイト構築ツールによって項目名は異なりますが、通常は次のように対応させます。

• 商品名と説明：それぞれnameとdescriptionに対応します。説明には商品の内容を簡潔にまとめ、ページ全体の宣伝文をそのまま項目に入れないでください。
• 商品画像：imageに対応します。一般公開され、商品を表す画像のURLを使用し、画像がページ上の表示内容と一致していることを確認します。
• ブランドと識別子：明確なブランドがある場合はbrandに入力します。SKUやGTINなどの識別子は、実在し、その商品に適用できる場合に限り入力し、独自に作成しないでください。
• 販売価格：価格、通貨、在庫状況は通常offersに設定し、それぞれprice、priceCurrency、availabilityに対応させます。通貨には標準コードを使用します。たとえば、米ドルはUSDです。

検索結果の各種表示機能には、それぞれ必須項目や推奨項目があります。Productを入力しただけで、すべての条件を満たすわけではありません。価格を公開していない問い合わせ専用ページでは、警告を消すために価格を捏造しないでください。まず実在する商品情報をマークアップし、次に対象の検索エンジンが該当する表示機能に求める要件を確認します。

エディターでマークアップを設定して公開する

1. 正しいページタイプを選択する。商品詳細ページまたは商品テンプレートを開き、構造化データ設定でProductが有効になっているか確認します。複数の商品を含む一覧ページ全体を、単一の商品として誤ってマークアップしないでください。
2. 商品項目を入力または紐付ける。マークアップの項目は、SEO設定欄に重複して手入力するのではなく、商品データベースの名称、画像、価格などに紐付けることを優先します。こうすることで、商品情報を更新したときにマークアップも同期しやすくなります。
3. 価格とバリエーションを設定する。単一の仕様で価格が明確な場合は、該当する価格を入力します。色、サイズ、型番によって価格が異なる場合は、ツールが対応するバリエーションの構造とページ上の実際の表示方法に従って設定し、すべての仕様に不適切な同一価格を適用しないでください。
4. 自動生成された内容を確認する。プレビューまたは公開後にページの出力を確認し、名称、画像、通貨、在庫状況が現在の商品情報に基づいていることを確かめます。テンプレートを複製した場合は、特に古い商品情報が残っていないか確認してください。

カスタムJSON-LDしか使えない場合は、エディターが対象の商品ページに出力することを確認し、ProductやOfferなどのタイプに関する仕様に従って項目を構成します。すでに自動マークアップがある場合は、内容が競合するProductデータをそのまま追加しないでください。まず、自動生成されたマークアップを編集、無効化、または修正できるか確認します。コードを追加した後は、引用符、カンマ、括弧が正しく閉じているかも確認してください。形式に誤りがあると、ブロック全体を解析できなくなるおそれがあります。

検証では「合格したかどうか」だけでなく内容も確認する

公開後、構造化データテストツールで実際のページURLを検査します。検索結果での商品リッチリザルトを目指す場合は、対象の検索エンジンが提供する専用テストツールも使用し、検出された項目、エラー、推奨項目を確認してください。コードを貼り付けるだけの場合より、公開URLを検査するほうが有効です。公開処理、テンプレート、スクリプトによる差異を見つけやすくなるためです。また、関連するクローラーがページにアクセスできる必要があります。

エラーが表示された場合は、まず該当する項目を特定し、商品エディターに戻ってデータを修正します。たとえば、priceが有効な数値でない、通貨が設定されていない、画像URLにアクセスできないといった場合は、データソースを修正してから再公開します。警告は必ずしもマークアップが無効であることを意味しませんが、情報が実際に存在するか、希望する表示資格に影響するかを判断してください。

テストで有効と表示されても、商品リッチリザルトが表示されないことがあります。これは必ずしも設定の失敗ではありません。検索エンジンは、ページのクロールとインデックス登録の可否、コンテンツの品質、検索クエリの状況、自身の表示ルールなども考慮します。公開後、再クロールまで時間がかかる場合もあります。同じコードを何度も追加するのではなく、サイト管理ツールでインデックス登録や構造化データの状態を確認してください。

価格、多言語対応、テンプレート更新後のメンテナンス

マークアップ公開後に最も起こりやすい問題は、データが古くなることです。セールの終了、在庫の変化、商品の販売終了に合わせて、ページ上の表示内容と構造化データも更新する必要があります。価格がサードパーティーのスクリプトで表示され、マークアップが手入力されている場合は、特に両者が同じデータソースを使用しているか確認してください。

多言語または多地域のサイトでは、ページごとに名称、説明、通貨、実際の価格を確認します。地域によって価格が異なる場合、別の地域のOfferをそのままコピーしないでください。問い合わせのみを目的とし、価格を公開していないページで、ECページの価格マークアップを引き継ぐことも避けてください。

テーマの変更、商品テンプレートの複製、アプリプラグインの調整後は、代表的な商品ページをいくつか再確認します。既存のマークアップが失われていないか、複数の機能を同時に有効にしたことで価格情報が矛盾していないかを確認してください。エディターで重複出力の場所を制御できない場合は、テンプレートまたはコードの担当者に調査を依頼してください。