Compare at price does not change when changing variant

Solved
New Member
4 0 0

Hello everyone, I am having an issue where my compare at price doesn't change when I select different variants. 

 

Here is a quick video: https://streamable.com/uza4i

 

Here is a picture of the prices in the backend.

compare at prices.PNG

 

This is the code

 {% if product.selected_or_first_available_variant.price < product.selected_or_first_available_variant.compare_at_price %}
    <li class="price">
      <span class="price-old" id="comparePrice" >{{ product.selected_or_first_available_variant.compare_at_price | money }}</span>
      <span class="price-new" id="productPrice">{{ product.selected_or_first_available_variant.price | money }}</span>
    </li>
    {% else %}
    <li class="price">
      <span id="productPrice">{{ product.selected_or_first_available_variant.price | money }}</span>
    </li>
    {% endif %}

Thanks for the help.

0 Likes
Shopify Partner
1137 91 138

Please share a store url to better assist.

Thanks & Regards
Perennial Solution

Problem Solved?✔️Like and Accept the solution that can help others.
Need any help with theme customization or design? Hire us
Email: infoperennialsolution@gmail.com
Skype: infoperennialsolution
0 Likes

Success.

Shopify Expert
2470 414 520

Hi @oclabs 

For that you have to check in your Variants select callback function because on variants selection its work base on Js code,

Check in Asset-.theme.js and find "if(variant)"

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
New Member
4 0 0

Fixed! I don't know much JS but I took a look at it and managed to get it fixed, Thank You!

0 Likes
Tourist
5 0 1

Would you mind sharing the code you added? I just uploaded my sale prices for early black friday, and all my product with variants are showing the price and sale price the same (both sale price value).

Thank you for any insight!

0 Likes
Tourist
5 0 1

<span itemprop="price" content="{{ variant.price | money_without_currency | remove: "," }}" class="{% if variant.compare_at_price > variant.price %}sale{% endif %}">
<span class="current_price {% if product.available == false %}hidden{% endif %}">
{% if variant.price > 0 %}
<span class="money">{{ variant.price | money }}</span>
{% else %}
<span class="money">{{ settings.free_price_text }}</span>
{% endif %}
</span>
</span>
<span class="was_price">
{% if variant.price < variant.compare_at_price and variant.available %}
<span class="money">{{ variant.compare_at_price | money }}</span>
{% endif %}
</span>

 

 

 

Would it be anything in this code?

0 Likes
New Member
4 0 0

 

{% if settings.product_show_compare_at_price %}
      if (variant.compare_at_price > variant.price) {
        var a11yComparePrice = Shopify.formatMoney(variant.compare_at_price, Shopify.money_format);
        var customComparePriceFormat = ' <span class="visually-hidden">' + a11yComparePrice + '</span>';
        $comparePrice.html(customComparePriceFormat);
      }
      {% endif %}

So this is currently what the code looks like once i fixed it. I'm using a theme off of themeforest so I never originally made the code but I was able to figure out how they got the price to change and just copied it to work for the sale price. This if statement had some commented out lines originally and I thought maybe they if I uncommented them everything would work but that wasn't the case so I got rid of those lines. I only added these two lines at the bottom which I copied from the code thats used to get the regular price to change and tweaked it so it would work for the compare price. 

 

var customComparePriceFormat = ' <span class="visually-hidden">' + a11yComparePrice + '</span>';
$comparePrice.html(customComparePriceFormat);

 

The rest of the code is what was there from the start. I don't know how much of this is useful to you, but like I said in the other post I don't know much JS. Also I found this code is my product.liquid file.

 

 

 

0 Likes
Tourist
5 0 1

Thank you for taking the time to reply, I'll start a new topic and see if anyone can help with my theme

1 Like