Displaying discount amounts

You can display discount amounts for individual items and for entire orders in your cart, checkout, and order templates. The following example shows a cart with two discounts applied to a specific item, and one discount applied to the entire order.

Example cart page with cart and line item discounts

Discounts can come from automatic discounts, Shopify Scripts, and manual discount codes. Each one of these creates discount_application and discount_allocation Liquid objects that can be used in your theme templates. However, manual discount codes can only create Liquid objects for the checkout.liquid and customers/order.liquid templates.

Understanding how discounts are calculated

Discounts are calculated by using two separate Liquid objects: discount_application and discount_allocation.

When a merchant creates a discount in their Shopify admin, they can choose from a list of criteria that determine when the discount should be applied. After a discount is applied successfully, a discount_application is registered to the cart or checkout. This contains information about how to reduce the price of the items so they reflect the discount.

When the reduced price is calculated, a discount_allocation is registered. It reflects the reduced amount on all the affected items. The discount_allocation contains the monetary value of the price reduction, and it determines the type of discount that made that allocation. A single discount_application can create more than one discount_allocation when the discount is eligible for multiple line items.

Displaying discounts for line items

If the discount applies to specific line items within an order in the cart, then the discount should be displayed beside those line items.

{% for item in cart.items %}
  ...
  {% if item.line_level_discount_allocations.size > 0 %}
    {% for discount_allocation in item.line_level_discount_allocations %}
      Discount {{ discount_allocation.discount_application.title }} (-{{ discount_allocation.amount | money }})
    {% endfor %}
  {% endif %}
  ...
{% endfor %}

The following example shows the discount price next to the original price. It's recommended that you display a strike-through line over the original price.

{% for item in cart.items %}
  {{ item.title }} - ({{ item.quantity }} x
  {% if item.original_line_price > item.final_line_price %}
    <s>{{ item.original_price | money }}</s>
  {% endif %}
  {{ item.final_price | money }}) {{ item.final_line_price | money }}
  {% if item.line_level_discount_allocations.size > 0 %}
    Discounts:
    <ul>
    {% for discount_allocation in item.line_level_discount_allocations %}
      <li>{{ discount_allocation.discount_application.title }}
      -{{ discount_allocation.amount | money }}</li>
    {% endfor %}
    </ul>
  {% endif %}
{% endfor %}

In this example:

  • item.final_price and item.final_line_price make sure that any line-item discounts are incorporated into the displayed price
  • {% if item.original_line_price > item.final_line_price %} checks if the final value is less than the original value before displaying a strike through
  • {{ discount_allocation.discount_application.title }} can be used to surface the discount title

Displaying discounts in the summary

A discount can be applied to an entire order instead of any specific products (for example, free shipping or 10% off for new customers). These cart-level discounts should be displayed at the bottom of the page after the subtotal. On the cart, checkout, and order pages, it's recommended that you present a subtotal directly after the line-item listing.

<!-- Cart subtotal -->
Subtotal: {{ cart.items_subtotal_price | money }}
<!-- Cart level discounts -->
{%- if cart.cart_level_discount_applications != blank -%}
Discounts:
<ul>
  {%- for discount_application in cart.cart_level_discount_applications -%}
    <li>{{- discount_application.title -}}
    -{{ discount_application.total_allocated_amount | money }}</li>
  {%- endfor -%}
  </ul>
{%- endif -%}
<!-- Final cart total -->
Total: {{ cart.total_price | money }}

In the above example:

  • cart.items_subtotal_price is used to display the cart's subtotal after totaling line-item amounts. Note that for the checkout and order object, the property will be line_items_subtotal_price.
  • cart.total_price includes the reduction from all cart-level discounts and should be presented as the last item in the summary section.

Ready to start selling with Shopify?

Try it free