How can I display a price range for product options without apps?

Technical Q&A
,
1

I have products that need to show a range of prices based on the option that they choose.

Medium armored shirt is $193

A Medium un-armored shirt is $93

3XL shirt armored is $209
A 3XL un-armored shirt is $109

I want the price on the product page to be a range of $93-209 but I do not see any way to do this without having to install an app and I worry the apps may not play well with others.

Any help would be great.

1 Like
2

Hi @KLC

The simple code I can think about is using map and sort. And I assume you are using theme with custom liquid enable to make it simpler to add. Please follow the instructions below.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Customize”.
  • Go to your product page, and add a “Custom liquid” block.
  • Place the the code below in the textfield provided
{% assign price_range = product.variants | map: "price" | sort %}
{{ price_range.first | money }} - {{  price_range.last | money }}

See image for reference:

Made4uoRibe_0-1698271296623.png
Made4uoRibe_0-1698271296623.png1899Ă—722 184 KB

2 Likes
3

WOW, awesome!!! Thank you very much. :slightly_smiling_face:

1 Like
4

That’s great! Any advice on how to make it hide on products that don’t have a price variant? Thank you.