Supply Theme - Unable to display the price of the first variant in collections page

Tourist
6 0 1

Hi,

The collections page is showing the price of the lowest variant whereas we would like to show the price of the first variant by default in the listings.

After going through the advice provided by experts in the various threads of the forum, we have edited the file Snippets/product-grid-item.liquid.

In this file, all the instances of product.price and product.compare_at_price have been changed to product.variants.first.price and product.variants.first.compare_at_price, respectively.  

However, this has not helped. The price of the lowest variant still features in the collections listing.

Is there anything we are missing out?

A big thank you in advance to all that can help us solve this.

0 Likes
Shopify Partner
1 0 0

Hi, I'm not an expert but I was trying to do the same thing, and all I did was, change this line: 

{% capture price %}{{ featured.price | money }}{% endcapture %}

To this: 

{% capture price %}{{ featured.variants.first.price | money }}{% endcapture %}

And it worked for me. Hope it helps!  

0 Likes
Shopify Expert
9981 85 1492

To get the price of the first variant would be like so:

{{ product.variants.first.price }}

Or for compare at price:

{{ product.variants.first.compare_at_price }}

If you've made that change and you're still seeing a different price shown I'd assume that either:

  1. You've not made the change in the correct place, or
  2. There's JavaScript also making changes to the price that might be skipping your Liquid edit.

Do you have a link to an example page that shows the lowest price showing vs the first variant price? Can you also post the snippet of code you changed that relates to that example.

★ Winning Partner of the Build a Business competition. ★ http://freakdesign.com.au
0 Likes
Highlighted
New Member
1 0 0

Hello

 

I am having the same problem. The price showing is the first variant's price.

 

Here is my product grid snipped code. What should I change here?


@Jason wrote:

To get the price of the first variant would be like so:

{{ product.variants.first.price }}

Or for compare at price:

{{ product.variants.first.compare_at_price }}

If you've made that change and you're still seeing a different price shown I'd assume that either:

  1. You've not made the change in the correct place, or
  2. There's JavaScript also making changes to the price that might be skipping your Liquid edit.

Do you have a link to an example page that shows the lowest price showing vs the first variant price? Can you also post the snippet of code you changed that relates to that example.


*<div class="product-item--price">
<span class="h1 medium--left">
{% if on_sale %}
<span class="visually-hidden">{{ "products.general.sale_price" | t }}</span>
{% else %}
<span class="visually-hidden">{{ "products.general.price " | t }}</span>
{% endif %}
{% include 'price' with product.price %}
{% if on_sale and section.settings.product_show_compare_at_price %}
<small>
<s>
<span class="visually-hidden">{{ "products.general.regular_price" | t }}</span>
{% include 'price' with product.compare_at_price %}
</s>
</small>
{% endif %}
</span>

0 Likes