Displaying Discounted & Original Prices in the Mini Cart

Question

Hi everyone,I’ve asked a similar question before regarding whether this functionality could be achieved with Liquid. However, this question is not specifically about whether it’s possible but rather if anyone has ideas for a workaround or solution to make this work.Here’s the scenario:I sell a product that costs €20 per unit. However, I offer a bulk discount: if a customer buys 5 or more units, the price drops to €15 per unit.Is there a way to display both the original price (€20) and the discounted price (€15) in the mini cart? For example: • When the customer adds 5 units of the product to the cart, the mini cart shows the original price (€20 x 5 = 100€) as crossed out and then calculates and displays the discounted price (€15 per unit x 5 = €75).I’m aware there are Shopify apps that handle this kind of functionality, but the mini-cart is based on the Shopify Cart API which doesn´t include both prices. Is there any way to achieve this feature in the mini cart, either with custom coding or a specific workaround?Thanks in advance for your help!

jonas.halbstark · Answer

Hi @consti, how do you crate the discount? Is it a variant or do you apply a automatic discount in the shopify backend?

consti · Answer

We used a Shopify app and configured it to apply a 10% discount if someone adds, for example, 5 units of Product X. The app works, but it does not display the original price (only the discounted price) because it requires Liquid code / the Liquid price attributes to do so. However, in the mini cart, it only utilizes the Shopify API and does not incorporate the Liquid attributes.

consti · Answer

@Jonathan Fors I thought maybe there is another way to display both prices, original and discounted, either with or without the app, while still applying the discounts.

jonas.halbstark · Answer

Do you mean like here? https://shop.katjes.de/products/al-paka-cola

jonas.halbstark · Answer

So you can add also 8 items and get a discount?

jonas.halbstark · Answer

if yes thats possible 🙂

jonas.halbstark · Answer

with the alpine extension you can see all the possible values

jonas.halbstark · Answer

this would be the discounted price: li-js-price="product.discounted_price"

consti · Answer

Thanks - how did you apply the discount?

jonas.halbstark · Answer

with automated discounts in shopify

consti · Answer

Thank you, I will try it

consti · Answer

@jonas.halbstark I’m currently setting up the discount tiers.
There are two issues, and I remember now why we didn’t use Shopify’s discount tiers back then:

All discounts need to be set up per product and tier, otherwise, combinations across products are possible.
As shown in the image, Shopify cannot manage two discount tiers within the same time frame.

Do you know what I can do?

consti · Answer

I found out, that shopify has a limit of 25 automatic discounts

jonas.halbstark · Answer

Hmm okay. Yes the combination would be a problem. Never seen this error. What kind of discounts are they?

jonas.halbstark · Answer

how does the original app handle teh discount? Do you have a link to the app?

consti · Answer

Amount off products

consti · Answer

And this is the App they used before https://apps.shopify.com/custom-pricing-discounts-by-appikon?locale=de

consti · Answer

I wrote the Support a while ago and they said if I use the normal liquid code, it will work without changes

jonas.halbstark · Answer

when the app also usese the normal discount mechanics it should work. This are the possible values you can use in the line_item: https://shopify.dev/docs/api/liquid/objects/line_item

consti · Answer

@jonas.halbstark I think with the Attributes from the starter template, the discounts in the mini-cart do not work. I added the same attributes used in the Katjes Shop and now its working

Welcome to the Liquify Community

Displaying Discounted & Original Prices in the Mini Cart