This article applies to Discount Ninja version 3 and above

Find your collection product template first. Not sure how to find or edit the file? Read this article first.

Add data tags

  • On the div or span that wraps around the markup for the product in the collection add the following data tag:
<span data-limoniapps-discountninja-product-handle="{{ product.handle }}">
   ...
   html markup of product in collection
   ...
</span>

Change the product price

  • Inside this section you'll also find the markup for the product price.
  • Add the following class to the markup of the price
limoniapps-discountninja-productprice
  • The technique is identical to the one described here for the product page

Set horizontal alignment

To adjust the alignment of the price you can add on of the following classes to the markup of the price (remember to always separate class names with a space):

  • limoniapps-discountninja-align-left
  • limoniapps-discountninja-align-center
  • limoniapps-discountninja-align-right

Other collection templates

Repeat this procedure for all other collections or product cards (used in a menu or on the home page for example) for which you wish to show discounted prices.

Did this answer your question?