Displaying "free" in cart drawer when item price is 0

New Member
5 0 0

I'm using the Envy Template and am trying to modify the cart drawer,


I would like the Quantity Selector & Price be hidden and replace by "Free for you" when the variant price is at $0.


This is what I thought the code should look like, but it's not working


{% if item.variant.price == "0" %}
<h1> Free for You </h1>
{% else %}
<div class="cart-item--quantity-price-wrapper">
<div class="cart-item--quantity-wrapper">
<button type="button" class="cart-item-quantity-button cart-item-decrease" data-amount="-1" aria-label="Reduce item quantity by one">-</button>
<input type="text" class="cart-item-quantity" min="1" pattern="[0-9]*" aria-label="quantity" />
<button type="button" class="cart-item-quantity-button cart-item-increase" data-amount="1" aria-label="Increase item quantity by one">+</button>
<div class="cart-item-price"></div>

{% endif %}


What am I doing wrong?

51 6 21

So try changing this line:

{% if item.variant.price == "0" %}


{% if item.variant.price == 0 %}

This should work because shopify saves the price as a number and not a string. When you have "" around something that means it is looking for the text version of that and not the number version of that. If it doesn't work I would add this line:

<script type="text/javascript">console.log({{item.variant.price|json}})</script>

Place this line anywhere you want and if you are using chrome just press F12 and it will open up the console. You can place this code in different places and see if it shows up. For example place it in your first if statement and if it doesn't show up it means it is failing that statement. It will also show you exactly what the value is of the item.variant.price when it does show up. Hope that helps!