this sticky button add to cart and buy now button proper not work
our size any size add to cart or buy now to automatic main variant order create website name - zelzis.com
probleam is ex i also product open and xl size add to cart to s size add to cart any size select and add to cart but also s size add to cart any product any help this case
Hi zelzis,
I can see the issue — what’s happening is that your sticky “Add to Cart” and “Buy Now” buttons aren’t updating dynamically when the customer selects a size. That means it’s always sending the default variant (in this case, size S) instead of the chosen one.
This usually happens because the sticky cart code isn’t connected to the product form’s variant selector logic. To fix it, you’ll need to:
Make sure your sticky buttons are wrapped inside the main <form> that contains the product variants.
If they’re separate, you need to add a script that updates the button’s variant ID every time a customer selects a new size. For example:
document.querySelectorAll('[name="Size"]').forEach(option => {
option.addEventListener('change', function() {
let selectedVariant = document.querySelector('select[name="id"]').value;
document.querySelector('.sticky-add-to-cart').setAttribute('data-variant-id', selectedVariant);
document.querySelector('.sticky-buy-now').setAttribute('data-variant-id', selectedVariant);
});
});
variant.id from Shopify’s product form, not hardcoded to the first option.Once this is set up, the sticky buttons will correctly add whichever size (or other variant) your customer selects.
If you’d like, I can help you apply the fix directly to your theme so you don’t run into hidden cart/checkout errors. It’s a quick adjustment but really important for conversions.
@zelzis Thanks for sharing the screenshot 
I understand the issue on your site (zelzis.com) when customers select a size (e.g., XL) and use the sticky Add to Cart or Buy Now buttons, the product added is always the default variant (S size) instead of the selected one. This happens when the sticky buttons are not properly linked to the active variant selection.
Here’s the best solution:
Most themes load a sticky “Add to Cart” or “Buy Now” bar separately from the main product form.
If that sticky bar isn’t coded to update when a customer changes the size/color, it always sends the default variant ID (usually the first one, like S).
You need to make sure the sticky cart buttons dynamically pull the currently selected variant ID from the product form.
Go to Online Store → Themes → Edit Code.
Open the file for your sticky cart (commonly in Sections → sticky-add-to-cart.liquid or similar).
Ensure the form uses the same id="product-form-{{ product.id }}" or variant selector logic as your main product form.
Example fix:
Replace any hardcoded variant ID with:
<input type="hidden" name="id" value="{{ product.selected_or_first_available_variant.id }}">
And for the button:
<button type="submit" class="sticky-add-to-cart">
Add to Cart
</button>
This ensures it always uses the currently selected variant.
If your sticky bar doesn’t update automatically, you can add a small script to sync it:
document.addEventListener('change', function(e) {
if (e.target.name === 'Size' || e.target.classList.contains('variant-input')) {
let selectedVariant = document.querySelector('[name="id"]').value;
document.querySelector('.sticky-add-to-cart [name="id"]').value = selectedVariant;
}
});
This script updates the hidden input in the sticky bar whenever the customer changes the variant (size/color).
If coding isn’t comfortable, you can:
Temporarily disable the sticky add-to-cart bar (in your Theme settings or app settings) until it’s fixed.
Or install a sticky cart app from the Shopify App Store that already supports dynamic variants.
This is a variant syncing issue once your sticky form uses the same variant ID as the main form, customers will be able to add the correct size/color to the cart.