How can I display the first variant's price on the collection page?

Technical Q&A

Topic summary

Goal: On Shopify’s Dawn theme collection pages, show the first variant’s price (not the lowest) for products with multiple variants.

Proposed fix (Liquid): Edit Snippets/price.liquid and set the price “target” to the product’s selected_or_first_available_variant, replacing the conditional that sometimes used the product object. This forces the collection price to mirror the first (or selected) variant’s price. (“Liquid” is Shopify’s templating language; a “variant” is a product option like size or strength.)

Results:

  • Confirmed working by multiple users.
  • One report that it still shows the lowest-priced variant; no troubleshooting steps provided.

Follow-up requests (unresolved):

  • Show all variant prices at once (e.g., “$2 - $6”).
  • Display a price range in the collection view.

Resource shared: A YouTube tutorial on showing variant details on collection pages.

Status: Partially resolved. The first-variant price approach works for some stores; issues for others and the price-range display remain open.

Summarized with AI on January 6. AI used: gpt-5.
1

I’m currently using the dawn theme and have multiple product with 3 different variants, each having their own prices. On the products/collection page the price displayed is the lowest price so if the lowest price is $0, which a lot of the products are because their prescription based products then it will say starting from $0. Is there a way i can make it so that display price on the collections page is the same price as the price of the first variant of the product?

thanks

1 Like
2

Hi @fljdak

This is certainly doable, do you have any liquid knowledge? If not we’ll do it for you shortly and post the solution here after requesting Collaborator access.

Cheers!

3

Hi @fljdak ,

To change you follow the instruction:

  1. Go to Online Store->Theme->Edit code
  2. Snippet->/price.liquid->Replace code position:
if use_variant
    assign target = product.selected_or_first_available_variant
  else
    assign target = product
  endif

AvadaCommerce_0-1642076648200.png
AvadaCommerce_0-1642076648200.png1350×508 55.2 KB

by below code:

assign target = product.selected_or_first_available_variant

AvadaCommerce_1-1642076711525.png
AvadaCommerce_1-1642076711525.png1365×479 51.2 KB

I hope it would help you.

3 Likes
4

Worked great for me!! thanks for posting this.

1 Like
5

Is it possible to show all variant prices at a time?
I have two variants for each product and I want to show them like this
$2 - $6

Thanks

1 Like
6

This code replacement worked great for me! However, I also wonder if there is a way to show the range of pricing in the collection view.

7

Hmm, that didn’t work on my store. It still displays the lowest priced variant by default, regardless of where that item is in the order.

8

Hey @fljdak , watch this concise tutorial to learn how to effortlessly show variant details on your Shopify collection pages.