Supply Theme: How to add a price range for a product with variants of different prices

Tourist
5 0 1

Hi,

I have the supply theme on my website and I love it but when I have multiple variants in one products with different prices, the website only displays the lowest priced variant until you click on the actual product. I actually got emails from customers saying I'm 'misleading' them by doing this. Reality is, it's automatic and I have no idea how to change it. I'm not too swift with code so if anyone has or knows how to write the code for what I'm talking about that would be so amazingly awesome. Here's the link to my website: http://www.mollipopdesign.com

 

Molli

0 Likes
Highlighted
Shopify Expert
781 64 175

You can use product liquid variables to do something like this:

 

{{ product.price_min | money }} - {{ product.price_max | money }}

That would show like this: $12.00 - $16.00.

 

To change on your collection page, look for the product thumbnail file in your theme editor files, it's usually something like product-thumbnail.liquid.

 

To change on the product page, it's probably in a section called product.liquid, or a snippet called something like product-form.liquid.

 

If you get stuck and want a developer to handle it for you, you can reach out to my team at speedboostr.com/contact. We regularly do edits like this.

 

 

 

Founder of Speed Boostr (Shopify optimization and dev agency).
Creator of Theme Scientist (A/B testing app).
Creator of Order Automator (app that auto tags + fulfills orders, send emails).
Creator of Tip Jar (add a tip button to your store).
Creator of Shopify Analyzer (free performance analysis tool).
My team also builds custom apps and automated solutions.
Enjoy the adventure!
0 Likes
Highlighted
Tourist
5 0 1

Hi! That is exactly what I would like to be done, but it's quite a bit over my head for exactly how to do that. I messaged your company and hopefully someone is able to help me get this accomplished. Thanks!

1 Like