Dawnで「割引前価格」を表示させたい

日本語 ディスカッション 技術的なQ＆A

Topic summary

問題の内容:
Dawnテーマの商品ページで「割引前価格」を表示する方法についての質問。以前は設定可能だったが、現在は見当たらず、運営からはコード編集を勧められた。また、「○％OFF」表示の実装方法についても確認を求めている。

提案された解決策:
回答者がmain-product.liquidファイルにLiquidコードを追加する方法を提示。具体的には:

  • sections/main-product.liquidを編集
  • variant.compare_at_priceとvariant.priceを比較して割引前価格、現在価格、割引率を表示するコードスニペットを提供
  • 別の投稿で紹介された方法でも実装可能と補足

最終的な結果:
質問者は提案されたコード編集方法ではうまくいかなかったが、商品管理画面を操作することで設定方法を発見し解決。さらに、使用していたテーマが実際にはDawnではなく「Rise」だったことが判明した。

Summarized with AI on October 28. AI used: claude-sonnet-4-5-20250929.
1

Dawnの商品ページで、「割引前価格」を表示したいです。

以前は設定できたようですが、現在はありません。

運営にチャットで質問したところ、コードを書き換えてください･･･みたいな回答でしたが、どのように書き換えればよろしいでしょうか？

また、その横に「○％OFF」と表示させる方法は、こちらの投稿で合っていますでしょうか？

よろしくお願いします。

1 Like
2

質問拝見しました。

Dawnテーマで「割引前価格（通常価格）」と「○％OFF」を商品ページに表示するには、Liquidコードを少し追記する必要があります。以下の方法で実装できます。

割引前価格と「○％OFF」の表示方法1. テーマエディタでコード編集 管理画面の「オンラインストア」→「テーマ」→「カスタマイズしたいテーマの横メニュー」→「コードを編集」をクリック。

  1. main-product.liquid を開く sections/main-product.liquid ファイルを開いて、次のコードを探します

    この付近、または product__info-container クラス付近に以下のコードを追加します。


  {{ product.selected_or_first_available_variant.price | money }}

以下のコードを追加

{% assign variant = product.selected_or_first_available_variant %}

  {% if variant.compare_at_price > variant.price %}
    
      {{ variant.compare_at_price | money }}
    
    
      {{ variant.price | money }}
    
    
      {{ ((variant.compare_at_price | minus: variant.price) | times: 100.0 | divided_by: variant.compare_at_price) | round }}% OFF
    
  {% else %}
    {{ variant.price | money }}
  {% endif %}

### 「○％OFF」表示について

ご質問にある別投稿の方法でも実装可能です。一応上記コードでも対応できるようにしております。

あくまで一例になりますので、ストアに合わせてコードの編集やデザインの改修をする必要が出てくるかと思います。

どのようなコードを使えば実装ができるのかの参考にしていただけますと幸いです。

なにかご質問があれば、お気軽にご相談ください。
お悩み解決できましたら、ベストアンサー、いいねいただけると励みになります。
何卒よろしくお願いします。

株式会社フルバランス

1 Like
3

回答ありがとうございました。

「割引前価格」について、教えていただいた方法ではできなかったんですが、通常の「商品管理画面」をいじっていたら設定方法がわかりました。

お手数かけてすいませんでした。

4

しかも「Dawn」ではなく「Rise」を使っていました :scream: