Hi there,
in my collection I added ‘?variant=here-comes-the-variant-id’ to the link url (like it’ done here). On my product page I try to access this url parameter via variant.selected (or product.selected) (or even product.selected_or_first_available_variant).
{% assign current_variant = variant.selected %}
But I can’t get the variant and I have no clue why.
Can someone please advise me what to do … thanks
Out of the 3 options you’ve mentioned, only the last one, product.selected_or_first_available_variant references proper variable and property. This should be right:
{% assign current = product.selected_or_first_available_variant %}
With product.selected_or_first_available_variant it is working now - I have no clue why I seemed not to work before. Still I’m confussed why product.selected and variant.selected do not give me any values. I will ignore these as I get my data with your advised method. Thanks a lot
'Cause product object has no .selected property, and for variant it has different meaning
https://help.shopify.com/themes/liquid/objects/product
https://help.shopify.com/themes/liquid/objects/variant#variant-selected
Thanks for your help
@tim_1 Is there any way to get selected variant title like cart page on the product page after selecting from the swatch.
Hi Tim
{%- assign current_variant = product.selected_or_first_available_variant -%}
{% if current_variant.id == 123 %}
{% endif %}
I am not getting this new id on variant change on product page . Always default variant id is coming . I am writing this code in product template . need a anchor tag based on selected variant .
your help will be appreciated .
Thank you
Hi All
I found that i can get variant sku by {{ variant.sku }} and if i am adding this in anchor tag , it’s working .
but below code is not working . I will be very grateful if someone can help
{% if variant.sku == ‘H0-S3TC-64ZA’ %}
do something
{% endif %}
Many Thanks
How can I get that value at runtime? I mean, how can I get with JavaScript the selected variation object when the select elements change.
@Product_1 Did you figure this out?
“How can I get that value at runtime? I mean, how can I get with JavaScript the selected variation object when the select elements change.”
Hi,
You can get the current product’s variant ID using below.
{{ product.selected_variant.id }}
You might actually want to use product.selected_or_first_available_variant.id - as I understand it, selected_variant is null if there’s no variant in the URL of the page you are on.
Having the same problem here, especially with the features of OS 2.0. Can’t add a text-block with the wanted metadata to the products template since the meta-data is assigned to the variants, not the products. Can however add a custom-liquid-block
{{ product.selected_or_first_available_variant.metafields.XXX['YYY']}}
but this doesn’t change when another varient is selected. Is there a way to react to variant-selection without messing with the actual templates code / js - files?
Any solutions to this?
Any updates?
I’m also stuck here. product.selected_or_first_available_variant is working when the page load and shows the first variant, still when changing through variants, it’s not working it stays in the first variant, and also selected_variant is not working !!!
Things get even worse. We are using the empire-theme by pixelunion and want to upgrade to a halfway decent version. We managed to write some custom javascript-code and attach a “change”-event-listener to the hidden selectbox, that is changed when a variant is selected. For some reason this doesn’t work propperly in empire 7.0.0. The strange thing is, that when we inspect the document, change the visibility of the selectbox from “hidden” to “block” an change the selected value manually, the event is triggered.
Did you solve this?
There should be a way, since shopify updates some info when variant picker is clicked (changes to variant image, inventory status, pick-up availability, etc.)
Please share any news