売り切れた商品の価格を非表示にする方法【DAWN】

Shopifyのテーマ「DAWN」で、在庫がない場合は商品ページでは価格を非表示にする方法を解説します。

セクション」フォルダ内のmain-product.liquidファイルを選択し、価格を読み込んでいるコードを編集します。

変更前:

{%- when 'price' -%}
  <div id="price-{{ section.id }}" role="status" {{ block.shopify_attributes }}>
    {%- render 'price',
      product: product,
      use_variant: true,
      show_badges: true,
      price_class: 'price--large'
     -%}
  </div>

変更後:

{%- when 'price' -%}
{% if product.available %}
  <div id="price-{{ section.id }}" role="status" {{ block.shopify_attributes }}>
    {%- render 'price',
      product: product,
      use_variant: true,
      show_badges: true,
      price_class: 'price--large'
     -%}
  </div>
{% endif %}

お問い合わせ・ご相談

ウェブに関することなら、
何でもお気軽にご相談ください。