検索エンジン向けに商品価格をローカライズする

テーマを更新して、検索エンジンの結果に表示される価格がお客様の通貨に対応するようにします。

検索エンジンは多くの場合、検索結果で商品の価格を返します。複数の通貨で販売する場合、検索結果に表示される通貨がお客様の現地通貨と一致しないことがあります。

お客様の検索結果にこのタイプの通貨の不一致が発生している場合、ストアのテーマを編集し、テーマに販売するロケールと通貨についての情報を含めるようにする必要があります。ほとんどの場合、テーマで次の設定を調整して実行できます。

  • 構造化データ
  • hreflangリンク
  • canonical URL設定

たとえば、オーストラリアとニュージーランドで販売しているとします。ニュージーランドのお客様があなたのTシャツを検索します。検索結果には、オーストラリアドル (20オーストラリアドル) での価格が表示されます。このお客様がその結果をクリックすると、ニュージーランドバージョンのTシャツの商品ページに移動します。このページでは、お客様にニュージーランドドル (22ニュージーランドドル) での価格が表示されます。お客様は検索結果と商品ページの価格差に気づいて困惑します。そして購入を遅らせます。

構造化データを使用する

ページ内マークアップを使用してデータを構造化し、検索エンジンに販売通貨を伝えます。構造化データは、検索エンジンがページのコンテンツを分類するために使用されます。また構造化データは、結果に商品の価格を表示するなどの検索結果の機能を有効にするためにも使用されます。

サポートする通貨ごとに、productの構造化データタイプを使用し、priceCurrencyプロパティを含める必要があります。このプロパティでは、通貨 (ISO 4217形式) について記述されています。またそのプロパティは、cart.currency.iso_codeに設定する必要があります (shop.currencyではない)。

Debutテーマでは構造化データに異なるフォーマットを使用しているため、これらのステップは不要です。Debutを使用している場合、これらのステップをスキップしてhreflang属性を使用することから始めます。

手順:

  1. テーマでoffersのitemscopeにネストされたpriceCurrencyプロパティを探します。通常、priceCurrencyは、[セクション] フォルダーのproduct-template.liquidで定義されています。このプロパティが見つからない場合、それをsections/product-template.liquidに追加します。
  2. priceCurrencycart.currency.iso_codeに設定されていることを確認します。

たとえば、コードは次のようになります。

<div itemscope itemtype=”http://schema.org/Product . . .
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
  <meta
    itemprop="priceCurrency"
    content="{{ cart.currency.iso_code }}"
  />
  . . .
</div>

[構造化データテストツール] を使用して、変更をテストできます。

hreflang属性を使用する

hreflang属性を使用して、検索エンジンに商品ページの異なるバージョンについて伝えることができます。販売に使用する通貨ごとに、通貨が適用される言語 ((ISO 639-1形式) および地域 (ISO 3166-1 Alpha 2形式) を指定する必要があります。

手順:

  1. theme.liquidファイルを開きます。このファイルには、<link ... >要素が含まれます。
  2. 販売に使用する通貨ごとに、link rel=alternate要素が含まれるようにしてください。たとえば、次のような要素があります。
<link
  rel="alternate"
  hreflang="LANG-CTRY"
  href="{{ canonical_url}}?currency=XXX"
/>`.

たとえば、米ドル、イギリスポンド、日本円の通貨で販売する場合、theme.liquidに次の行が含まれるようにします。

<head>
  ...
  <link
    rel="alternate"
    hreflang="en-us"
    href="{{ canonical_url }}?currency=USD"
  />
  <link
    rel="alternate"
    hreflang="en-gb"
    href="{{ canonical_url }}?currency=GBP"
  />
  <link
    rel="alternate"
    hreflang="ja-jp"
    href="{{ canonical_url }}?currency=JPY"
  />
  ...
</head>

ユーロ (EUR) で販売する場合、サポートするロケール (言語/国) を指定する必要があります。サポートするユーロのロケールごとに、<link>要素を追加し、そのロケールにhreflang属性を含めます。

たとえば、次の行は、フランスのフランス語話者、ドイツのドイツ語話者、オランダの英語話者とオランダ語話者に商品ページのユーロバージョンを表示するよう検索エンジンに指示します。

...
<link
  rel="alternate"
  hreflang="fr-fr"
  href="{{ canonical_url }}?currency=EUR"
/>
<link
  rel="alternate"
  hreflang="de-de"
  href="{{ canonical_url }}?currency=EUR"
/>
<link
  rel="alternate"
  hreflang="en-nl"
  href="{{ canonical_url }}?currency=EUR"
/>
<link
  rel="alternate"
  hreflang="nl-nl"
  href="{{ canonical_url }}?currency=EUR"
/>
...
  1. link rel=alternate要素を追加し、hreflangx-defaultに設定します。検索エンジンでは、お客様がサポートされていないロケールから訪問している場合、このフォールバックリンクが使用されます。
<link
  rel="alternate"
  hreflang="x-default"
  href="{{ canonical_url }}"
/>

ステップ3: canonical URLを使用する

canonical URLとして使用するURLを検索エンジンに伝えます。このようにすることで、参照されている国別のページが、他のページの複製ではなく、別個の独立したページであることを検索エンジンに知らせることができます。このように設定されると、検索エンジンはどの通貨を表示したらよいか判断できるようになります。<link rel="canonical" href="{{ canonical_url }}">を使用し、cart.currency.iso_codeを含めます。

手順:

  1. theme.liquidで、canonicalリンクを検索します。このリンクが見つからない場合、次のリンクを追加します。
<link rel="canonical" href="{{ canonical_url }}>"
  1. canonical URLにcart.currency.iso_codeが含まれていることを確認します。
<link
  rel="canonical"
  href="{{ canonical_url }}?currency={{ cart.currency.iso_code }}"
/>

関連リンク

Shopifyで販売を開始する準備はできていますか?

無料体験を試す