Skip to product information
1 of 1
Published:2024.06.23

Example of settings to display "Discount rate" and "Discount amount" on the "Sale" badge on the product detail page of the Shopify theme "Dawn"

Example of settings to display "Discount rate" and "Discount amount" on the "Sale" badge on the product detail page of the Shopify theme "Dawn"

Applications

  • Product information management and editing

How to implement

  • HTML/CSS
  • LIQUID
View full details

When you set up the collection page of the Shopify theme "Dawn" to display "Discount Rate" and "Discount Amount" labels for sale items (https://store-dojo.com/products/2025-06-20), you might want to display them in the product details as well. Here's an example of how to do that. Thanks to standard JS, the labels will change automatically when the variant changes.


Example of settings to display "Discount rate" and "Discount amount" on the "Sale" badge on the product detail page of the theme "Dawn"


[(For the Dawn theme) Setting method ①] Add a schema to "main-product.liquid" and a label to "ja.schema.json"


[(For the Dawn theme) Setting method ②] Add code to "main-product.liquid" and "price.liquid"


After making a purchase (all items are ¥0), you will be able to view the sample code.

If you have already made a purchase, please login here.

Sample Codes

Test Theme :Dawn/Rise 15.2.0

Add schema to "main-product.liquid"

Related Post