Display "FREE"under product card thumbnail in Venture theme

Solved
Highlighted
Tourist
15 0 0

Hello beautiful people.

I am having an issue with displaying the word "FREE" underneath my product card thumbnail when i set the price as $0. I already changed the code thanks to a topic I found in this forum. It shows "FREE" only on the product page after you have clicked on it. What should I do? I'm using Venture theme.

 

My store: Take My Beans 

Password: keekee

 

Thanks.

 

Change $0 to FREEChange $0 to FREE

0 Likes
Highlighted

on product-template section :check your price if price is equal to 0 than show your free html

Shopify theme developer and customization

I Would like to add new functionality or customize an existing one, please hire me.
If helpful then please Like and Accept Solution .
Email: ashiquehussaincodediary@gmail.com

0 Likes
Highlighted
Astronaut
1125 150 295

What section is that in Venture theme? I can't right click on your website so I can't inspect the code. You'll need to go into that section and find your product price and like @ashiqueh4  said you'll need to check if the products price is 0 and display FREE instead of 0. Probably something like:

 

{% if product.price > 0 %}
{{ product.price }}
{% else %}
FREE
{% endunless%}
If my solution helped you, please like and accept as solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Highlighted
Tourist
15 0 0

Thank you both of you. I have re-enabled the right click so you guys can go and check it out. 

0 Likes

Success.

Astronaut
1125 150 295

Backup your theme in case anything goes wrong. You can go to Online Store > Actions > Edit Code -- Open your Snippets folder and open up product-card.liquid.

 

Scroll to around line 63, you should see this directly after a comment that says "Not on sale but still may have varying prices":

 

          {% if product.price_varies %}
            {% assign price = product.price | money_without_trailing_zeros %}
            {{ 'products.product.from_text_html' | t: price: price }}
          {% else %}
            <span class="visually-hidden">{{ 'products.product.regular_price' | t }}</span>
            {{ product.price | money_without_trailing_zeros }}
          {% endif %}

You can change that to this and it should give you what you want:

 

          {% if product.price_varies %}
            {% assign price = product.price | money_without_trailing_zeros %}
            {{ 'products.product.from_text_html' | t: price: price }}
          {% else %}
            <span class="visually-hidden">{{ 'products.product.regular_price' | t }}</span>
        	{% if product.price > 0 %}
            {{ product.price | money_without_trailing_zeros }}
        	{% else %}
        	<b>FREE</b>
        	{% endif %}
          {% endif %}

If you want it for sale prices (say you had an item that was a certain amount and you wanted to give it away for free, but also wanted to show the compare at price) you'll have to change the code above that comment in a similar way.

If my solution helped you, please like and accept as solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Highlighted
Tourist
15 0 0

OMG! It works thank you. However, on some products, it still displays 0$. You can go and check out on my site. Some products successfully displayed FREE while others stayed at $0.

 

(UPDATE): It finally works for real on all the products I set for free. Actually, I accidentally put the price compared to another one and that's why it showed 0$ instead of FREE. All I had to do is delete the compared price and voilà.

0 Likes
Highlighted
Astronaut
1125 150 295

Good, I initially thought you might have that issue, so I was trying to work it out but I'm glad you got it fixed. 

If my solution helped you, please like and accept as solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes