Liquid, JavaScript, themes, sales channels
I am using the theme Narrative and added 3 variable to my product page - size, bottom and sleeve. As well as custom coded 4 variables.
When choosing my variables and adding them to cart, my cart doesn't reflect my selections. What I see in the checkout page is, the default selection - XS, Harem, Basic even when I changed those selections and add them to cart.
Does anyone know why this would happen?
This is what my cart.liquid looks like:
{% comment %}
The contents of the cart.liquid template can be found in /sections/cart-template/
{% endcomment %}
{% section 'cart-template' %}
Solved! Go to the solution
This is an accepted solution.
Hi @ellylla,
Please remove 'data-option-input' for properties, it will work fine: https://i.imgur.com/XjmrDZB.png
Hope it helps!
Hi @ellylla,
Please send your site and if your site is password protected, please send me the password. I will check it for you.
Hi - I'd really appreciate that! The page is: https://wearellylla.com/products/evolve-top-set. When I change the variables, it's not reflected in the checkout.
Another note, is I created a custom section for this product page with this extra code:
<div class="product-form__item">
<label class = "single-option-selector__label" for "top color">Top Color
</label><br>
<select id="top-colour" name="properties[Top Colour]" class="single-option-selector" data-option-input="padding-left: 71.9219px; opacity: 1;">
<option value="Black">Black</option>
<option value="White">White</option>
</select>
</div>
<div class="product-form__item">
<label class = "single-option-selector__label" for "sleeve color">
Sleeve Color
</label>
<select id="sleeve-colour" name="properties[Sleeve Colour]" class="single-option-selector" data-option-input="padding-left: 71.9219px; opacity: 1;">
<option value="Black">Black</option>
<option value="White">White</option>
</select>
</div>
<div class="product-form__item">
<label class = "single-option-selector__label" for "sleeves">Sleeve Extension Color</label><br>
<select class="single-option-selector" data-option-input="padding-left: 71.9219px; opacity: 1;" id="sleeve-extension-color" name="properties[Sleeve Extension Color]">
<option value="Black">Black</option>
<option value="White">White</option>
</select>
</div>
<div class="product-form__item">
<label class = "single-option-selector__label" for "sleeves">Bottom Color</label><br>
<select class="single-option-selector" data-option-input="padding-left: 71.9219px; opacity: 1;" id="bottom-color" name="properties[Bottom Color]">
<option value="Black">Black</option>
<option value="White">White</option>
</select>
</div>
I am assuming that this is why it's not working because when I use another product template, the variables reflect.
Thanks so much!
This is an accepted solution.
Hi @ellylla,
Please remove 'data-option-input' for properties, it will work fine: https://i.imgur.com/XjmrDZB.png
Hope it helps!
Yes! It works! Thanks so much for the help 🙂
@LitCommerceI am having a similar problem but I can't figure out why. Would you be able to help me? I am using Debut Theme on this website: https://tartar-berlin.com. Thank you so much!
User | RANK |
---|---|
37 | |
28 | |
13 | |
13 | |
9 |
On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023The year-end shopping season is just around the corner. Is a flash sale on your radar? Are...
By Jasonh Nov 6, 2023