Getting discount % using discount code

Hey! Shopify community, I have created the discounts using discount code. Now i want to get the discounted percentage using liquid and discount code. How i can do that??

This is Amelia from PageFly - Landing Page Builder App

You can calculate the discount percentage based on the original price and the discounted price. Here’s how you can do it:

  1. Calculate the Discount Percentage:

    • You can use Liquid to calculate the percentage discount by comparing the original price (compare_at_price) and the discounted price (price).
  2. Add the Code to Your Theme:

    • Go to your Shopify admin and navigate to Online Store > Themes > Actions > Edit Code.
    • Open the file where you want to display the discount percentage. This could be product-template.liquid, collection-template.liquid, or another relevant file.
  3. Insert the Liquid Code:

    • Add the following Liquid code to calculate and display the discount percentage:

      {% if product.compare_at_price > product.price %}
        {% assign discount_percentage = 100 | times: (product.compare_at_price | minus: product.price) | divided_by: product.compare_at_price | round %}
        <span class="discount-percentage">{{ discount_percentage }}% OFF</span>
      {% endif %}
      
  4. Customize the Display:

    • You can style the discount percentage using CSS to match your store’s design. For example:

      .discount-percentage {
        color: red;
        font-weight: bold;
      }
      

Example Implementation

Here’s an example of how you might integrate this into a product page:

<div class="product-price">
  <span class="original-price">{{ product.compare_at_price | money }}</span>
  <span class="discounted-price">{{ product.price | money }}</span>
  {% if product.compare_at_price > product.price %}
    {% assign discount_percentage = 100 | times: (product.compare_at_price | minus: product.price) | divided_by: product.compare_at_price | round %}
    <span class="discount-percentage">{{ discount_percentage }}% OFF</span>
  {% endif %}
</div>

You should remember that:

  • Ensure compare_at_price is Set: This calculation relies on the compare_at_price being set for your products. Make sure this field is populated in your product data.
  • Test Your Changes: After making these changes, test them on your store to ensure they display correctly and calculate the discount accurately.

Hope that my solution works for you.

Best regards,

Amelia | PageFly