Display Price Of Available Variants, Not Lowest Price

Shopify Discussion

Topic summary

A Shopify store owner successfully modified their product card pricing display to show the first available variant’s price instead of the lowest price across all variants. The issue occurred when sale prices were applied to all variants—the system would still pull the lowest price rather than the first in-stock variant’s price.

Solution implemented:

  • Changed the code from product.variants | sort: 'price' | first to product.variants | where: 'available', true | first
  • This filters variants by availability before selecting the first one
  • The modification was made in the price-list.liquid snippet file (for Impact theme users)

Current status:

  • Initial implementation worked successfully
  • However, the original poster later reported the code stopped working
  • Other users requested similar help for different themes (Motion theme mentioned), but no additional solutions were provided
  • The thread remains unresolved regarding the code’s long-term functionality
Summarized with AI on November 4. AI used: claude-sonnet-4-5-20250929.
1

Hello.

I have fixed it so that it shows the first available variant instead of the lowest price.

If I then have offers for all variants, then it takes the price of the offer from the lowest price and not the first variant that is in stock.

Hope you can help.

Here is the code

PRODUCT CASE (used on card)

{%- endcomment -%}
{%- if product.price_varies and product.compare_at_price -%}
{%- assign cheapest_variant = product.variants | sort: ‘price’ | first -%}

{%- capture price_min -%}
{%- if settings.currency_code_enabled -%}
{{- cheapest_variant.price | money_with_currency -}}
{%- else -%}
{{ product.selected_or_first_available_variant.price | money }}
{%- endif -%}
{%- endcapture -%}

{%- if cheapest_variant.price < cheapest_variant.compare_at_price -%}

{{ ‘product.price.sale_price’ | t }}
{{- ‘product.price.from_price_html’ | t: price_min: price_min -}}

{{ 'product.price.regular_price' | t }}

{%- if settings.currency_code_enabled -%}
{{- cheapest_variant.compare_at_price | money_with_currency -}}
{%- else -%}
{{- cheapest_variant.compare_at_price | money -}}
{%- endif -%}

{%- else -%}

{{ ‘product.price.sale_price’ | t }}
{{- ‘product.price.from_price_html’ | t: price_min: price_min -}}

{%- endif -%}
{%- elsif product.price < product.compare_at_price -%}

{{ ‘product.price.sale_price’ | t }}

{%- if settings.currency_code_enabled -%}
{{- product.price | money_with_currency -}}
{%- else -%}
{{- product.price | money -}}
{%- endif -%}

{{ 'product.price.regular_price' | t }}

{%- if settings.currency_code_enabled -%}
{{- product.compare_at_price | money_with_currency -}}
{%- else -%}
{{- product.compare_at_price | money -}}
{%- endif -%}

{%- elsif product.price_varies -%}
{%- capture price_min -%}
{%- if settings.currency_code_enabled -%}
{{ product.price_min | money_with_currency }}
{%- else -%}
{{ product.price_min | money }}
{%- endif -%}
{%- endcapture -%}

{%- capture price_max -%}
{%- if settings.currency_code_enabled -%}
{{- product.price_max | money_with_currency -}}
{%- else -%}
{{- product.price_max | money -}}
{%- endif -%}
{%- endcapture -%}

{{ 'product.price.sale_price' | t }} {{- 'product.price.from_price_html' | t: price_min: price_min, price_max: price_max -}} {%- else -%} {{ 'product.price.sale_price' | t }}

{%- if settings.currency_code_enabled -%}
{{- product.price | money_with_currency -}}
{%- else -%}
{{- product.price | money -}}
{%- endif -%}

{%- endif -%}
{%- endif -%}

{%- unless hide_unit_price -%}
{%- assign unit_price_item = variant | default: line_item | default: product.selected_or_first_available_variant -%}

{%- if unit_price_item.unit_price or form_id != blank -%}
<unit-price {% if form_id %}form=“{{ form_id }}”{% endif %} {% unless unit_price_item.unit_price %}hidden{% endunless %} class=“{{ unit_price_classes }}”>
{%- assign unit_price_measurement = unit_price_item.unit_price_measurement -%}

{%- if unit_price_measurement.reference_value != 1 -%}
{%- assign reference_value = unit_price_measurement.reference_value -%}
{%- endif -%}

({{ unit_price_item.unit_price | money }}/{{ reference_value }}{{ unit_price_measurement.reference_unit }})

{%- endif -%}
{%- endunless -%}

1 Like
2

Hello @Dclootbox

Based on the provided code snippet, it appears that you are trying to display the prices for different variants of a product in your Shopify store. If I understand correctly, you want to modify the code to display the first available variant’s price instead of the lowest price when all variants have offers.

To achieve this, you can make the following changes to your code:

Replace the following line:

{%- assign cheapest_variant = product.variants | sort: 'price' | first -%}

with:

{%- assign cheapest_variant = product.variants | where: 'available', true | first -%}

This change will ensure that the cheapest_variant variable is assigned the first available variant instead of the one with the lowest price.

Please note that the modified code assumes that you have a available property for each variant that indicates whether the variant is available or not.

After making this change, test your product page to verify if the first available variant’s price is displayed correctly when all variants have offers.

Remember to always backup your theme files before making any modifications and test the changes thoroughly to ensure they work as expected.

1 Like
3

worked like a charm :slightly_smiling_face:

Thanks a lot.

1 Like
4

Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance.
If helpful then please Like and Accept Solution.

5

What file to edtit?

6

Where can i modify this, i have MOTION Theme?

7

Where can i modify this, i have MOTION Theme?

8

Hello @Dclootbox Is your code above to show the default variant in the catalog page rather than the cheapest? If so this is exactly what I’m struggling to do. Could you please let me know (in very basic terms) where your code goes/replaces? If you could help I’d really appreciate it.

Thanks.

9

Hello.

The code dont work anymore ..

10

Oh, sad. Thanks for letting me know.

11

PRODUCT CASE (used on card)

{%- endcomment -%}
{%- if product.price_varies and product.compare_at_price -%}
{%- assign cheapest_variant = product.variants | where: ‘available’, true | first -%}

{%- capture price_min -%}
{%- if settings.currency_code_enabled -%}
{{- cheapest_variant.price | money_with_currency -}}
{%- else -%}
{{ product.selected_or_first_available_variant.price | money }}
{%- endif -%}
{%- endcapture -%}

{%- if cheapest_variant.price < cheapest_variant.compare_at_price -%}

{{ ‘product.price.sale_price’ | t }}
{{- ‘product.price.from_price_html’ | t: price_min: price_min -}}

{{ 'product.price.regular_price' | t }}

{%- if settings.currency_code_enabled -%}
{{- cheapest_variant.compare_at_price | money_with_currency -}}
{%- else -%}
{{- cheapest_variant.compare_at_price | money -}}
{%- endif -%}

{%- else -%}

{{ ‘product.price.sale_price’ | t }}
{{- ‘product.price.from_price_html’ | t: price_min: price_min -}}

{%- endif -%}
{%- elsif product.price < product.compare_at_price -%}

{{ ‘product.price.sale_price’ | t }}

{%- if settings.currency_code_enabled -%}
{{- product.price | money_with_currency -}}
{%- else -%}
{{- product.price | money -}}
{%- endif -%}

{{ 'product.price.regular_price' | t }}

{%- if settings.currency_code_enabled -%}
{{- product.compare_at_price | money_with_currency -}}
{%- else -%}
{{- product.compare_at_price | money -}}
{%- endif -%}

{%- elsif product.price_varies -%}
{%- capture price_min -%}
{%- if settings.currency_code_enabled -%}
{{ product.price_min | money_with_currency }}
{%- else -%}
{{ product.selected_or_first_available_variant.price | money }}
{%- endif -%}
{%- endcapture -%}

{%- capture price_max -%}
{%- if settings.currency_code_enabled -%}
{{- product.price_max | money_with_currency -}}
{%- else -%}
{{- product.price_max | money -}}
{%- endif -%}
{%- endcapture -%}

{{ 'product.price.sale_price' | t }} {{- 'product.price.from_price_html' | t: price_min: price_min, price_max: price_max -}} {%- else -%} {{ 'product.price.sale_price' | t }}

{%- if settings.currency_code_enabled -%}
{{- product.price | money_with_currency -}}
{%- else -%}
{{- product.price | money -}}
{%- endif -%}

{%- endif -%}
{%- endif -%}

{%- unless hide_unit_price -%}
{%- assign unit_price_item = variant | default: line_item | default: product.selected_or_first_available_variant -%}

{%- if unit_price_item.unit_price or form_id != blank -%}
<unit-price {% if form_id %}form=“{{ form_id }}”{% endif %} {% unless unit_price_item.unit_price %}hidden{% endunless %} class=“{{ unit_price_classes }}”>
{%- assign unit_price_measurement = unit_price_item.unit_price_measurement -%}

{%- if unit_price_measurement.reference_value != 1 -%}
{%- assign reference_value = unit_price_measurement.reference_value -%}
{%- endif -%}

({{ unit_price_item.unit_price | money }}/{{ reference_value }}{{ unit_price_measurement.reference_unit }})

{%- endif -%}
{%- endunless -%}

12

im my theme (impact) i put it under snippet/price-list.liquid