「Advanced Custom Fields」アプリでProduct variantsに設定したmetafieldsが表示できない

Topic summary

「Advanced Custom Fields」で商品バリエーション(Product variants)に設定した metafield が、商品ページで表示されない問題。

  • 商品(Product)単位の metafield は、{{ product.metafields.namespace.key }} で正常に表示できていた。
  • 一方、バリエーション用に設定した Shipping.Hokkaido{{ variant.metafields.Shipping.Hokkaido }} で直接 product-template.liquid に書いても表示されなかった。添付画像は、ACF側の設定内容と metafield 登録状況の確認に使われている。

主な回答では、variant はループ内で扱う必要があるとして、{% for variant in product.variants %} を使う方法が提案された。これにより、各バリエーションの metafield は表示できることが確認された。

現状は部分的に解決。

  • 表示できない問題自体は解消。
  • ただし、全バリエーション分が一覧表示されてしまうため、今後は「現在選択中のバリエーションに対応する metafield だけを表示する」実装が必要。

結論として、Product variants では Product と同じ書き方では不十分で、バリエーションの文脈(ループや選択状態)を考慮する必要がある。

Summarized with AI on March 10. AI used: gpt-5.4.

jizoさん

アドバイスいただき、ありがとうございました。

ご指摘いただいた「for文」、確かに記述しておりませんでした!

お教えいただいたように、product-template.liquidに下記コードを追記しましたところ、登録したmetafieldは表示できました。

{% for variant in product.variants %}
  {{ variant.metafields.Shipping.Hokkaido }}
{% endfor %}

ただ、その商品の全てのバリエーションのmetafieldがズラズラっと表示されてしまいましたので、

金額表示と同じように選択したバリエーションと対になったmetafieldのみを表示するには、タグとの組み合わせなどが必要かな?と想像しました。

後でもう少しコードを工夫してみます。

数日間まともに動作させられずモヤモヤしていたのですが、ようやく光が見えてきました。

本当にありがとうございました!

1 Like