NOTE: This article is deprecated, please refer to the section "Setting up Dynamic Pricing" for an up to date version of this article that applies for the latest version of Discount Ninja

Find your cart template

  • Click on "Online Store" in your Sales Channels in the Shopify admin.
  • Then click Themes.
  • From the Action menu on the right, select "Edit code".
  • Next, find your cart template in the Templates, Sections or Snippets folder. You're looking for the file that contains the markup that displays the cart page.

Take a backup

  • Copy the content of the template before you make any changes. Create a separate file and paste the content. Repeat for every file you plan to change. Better safe than sorry!

Basic set up: allow Discount Ninja to calculate prices

  • Find the line of code that loops through the items in your cart, it usually looks something like this: {% for item in cart.items %}
  • When you've found the markup, add the Discount Ninja specific tags.
  • {% include 'limoniapps-discounturl-cart-lineitem', item: item %} goes on the line after the start of the loop.
  • {% include 'limoniapps-discounturl-cart' %} goes on the line after the end of the loop.
  • The end result looks something like this:

        {% for item in cart.items %}
          {% include 'limoniapps-discounturl-cart-lineitem', item: item %}
       
  ...
        {% endfor %}
        {% include 'limoniapps-discounturl-cart' %}

Handle properties

Discount Ninja passes through data using line item cart properties. This next change avoids that this technical data is shown on the cart page.

  • Find the line of code that loops through the items in your cart, it usually looks something like this: {% for p in cart.properties %}
  • If such a loop is not available, you can skip this section.
  • The loop starts with {% for ... %} and ends with {% endfor %}. If it's not already the case, we'll need to wrap the code inside this block between {% unless ... %} and {% endunless %} statements.
  • Specifically the {% unless ... %} line needs to state: {% unless p.first == 'limoniapps-discounturl' %}
  • If there already is an {% unless ... %} block in place (e.g. {% unless p.last == blank %}) simply add our statement to it followed by 'or': {% unless p.first == 'limoniapps-discounturl' or p.last == blank %}
  • The end result is something like:

{% for p in item.properties %}
               {% unless p.first == 'limoniapps-discounturl' or p.last == blank %}
               ...
               {% endunless %}
{% endfor %}

Decide which components you need

Discount Ninja allows you to add 6 different components to your cart page, they are as follows:

Depending on your theme's cart design and your specific needs you may need all or some of those components.
The following components are mandatory: 2 or 3, and 4

Component 1: show savings per product

Under the {% for p in item.properties %} loop add the lines in bold after the {% endif %}:

{% if item.properties.size > 0 %}
  {% for p in item.properties %}
     ...
  {% endfor %}
{% endif %}
{% if discounturl_lineitem_savings_visible %}
    <br/>{% include 'limoniapps-discounturl-cart-markup-linesavings' %}
{% endif %}

Component 2: show the discounted price of the product

  • Next, find the line that specifies the price of the product. You're looking for something like: item.price | money.
  • Add the lines in bold around the original line you found.
  • The end result should look something like this:

{% if discounturl_lineitem_discountamount > 0 %}
  {% include 'limoniapps-discounturl-cart-markup-productprice' %}
{% else %}

   ... the original line(s) you found ...
{% endif %}

Component 3: Show discounted price per cart line

  • Next, find the line that specifies the price of a line in your cart. You're looking for something like: item.line_price | money.
  • Add the lines in bold around the original line you found.
  • The end result should look something like this:

{% if discounturl_lineitem_discountamount > 0 %}
  {% include 'limoniapps-discounturl-cart-markup-lineprice' %}
{% else %}

   ... the original line(s) your found ...
{% endif %}

Component 4: Show the discounted subtotal 

  • Next, find the line that shows the subtotal of your cart. You're looking for something like: cart.total_price.
  • Typically you'll find a label (cart.general.subtotal) a few lines before.
  • Add the lines in bold around the original line you found (leave the cart.general.subtotal label untouched).
  • The end result should look something like this:

<span>{{ 'cart.general.subtotal' | t }}</span>
{% if discounturl_cart_discountamount_total > 0 %}
   {% include 'limoniapps-discounturl-cart-markup-subtotal' %}

{% else %}
   ... the original line(s) your found ...
{% endif %}

Component 5: Show the total discount

  • If your cart has a section designed to show the discount, you can add this next line to it. If not, simply add the line below the subtotal:
  • {% include 'limoniapps-discounturl-cart-markup-totaldiscount' %} 
  • Add a line break with <br> if necessary.

Component 6: Show the cart level savings label

  • Below the discount, on a seperate line add:
  • {% include 'limoniapps-discounturl-cart-markup-cartsavings' %} 
  • Add a line break with <br> if necessary.

Final touch: add a class to the checkout button

  • Finally, find the checkout button. You're looking for a submit button (input tag), typically named Checkout.
  • Check if the button has css classes (class attribute).
  • Add limoniapps-discounturl-checkout  to the css classes defined for this button (css classes are seperated by a space).
  • The end result looks something like this:

<input type="submit" name="checkout" id="checkout" value="{{ 'cart.general.checkout' | t }}" class="button limoniapps-discounturl-checkout" />

Test

  • Save all files and test!
Did this answer your question?