Shopify themes, liquid, logos, and UX
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
Solved! Go to the solution
This is an accepted solution.
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 %}
This is an accepted solution.
'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
This is an accepted solution.
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 %}
Hi Tim
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
Many Thanks
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.
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
This is an accepted solution.
'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
@tim Is there any way to get selected variant title like cart page on the product page after selecting from the swatch.
Thanks for your help
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.
@ProductDid 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."
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?
Sagar @ Avyya - Modern Sales Booster
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
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.
<script>
window.onload = function() {
f=document.querySelector(".variant-selection__variants[name='id']");
f.addEventListener('change',function() {... } );
}
</script>
Any updates?
Sagar @ Avyya - Modern Sales Booster
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
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 !!!
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
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024