Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
We have a few orders every week where the selected size in Shopify shows up as XS (our smallest, default size) even though the customer selected a different size. This of course leads to unnecessary returns and is annoying for the customer.
Most orders that we get are fine though and have the correct sizes. I have not been able to reproduce this yet. I don't believe it is due to user error due to the frequency it happens.
We are using a (highly) customised version of the Prestige theme.
Example product where this has recently happened: https://au.deuscustoms.com/products/whiplash-tee-forest-night
Any ideas on why this could be happening or how to go about debugging it?
Hello @michelleretzlaf ,
It happens if there is JS conflict in store but in your store I checked there is no conflict.
Can you share those specific product URL which customer add and they come up with wrong variants so we can check them.
Thanks
Hi Guleria,
Thanks for your reply!
An example as mentioned is https://au.deuscustoms.com/products/whiplash-tee-forest-night - depending on your location, you will have to use a VPN set to Australia.
90% this is happening because they are making a selection before the page has actually fully loaded.
When you confirm the basic testing steps below to establish ground-truth a quick fix can simply be to add a transition to the page that hides the add to cart until the relevant code is actually loaded.
A real fix is to optimize the theme to prioritize product form related javascript to load asap. It's kinda nuts this isn't the norm /shrug.
So whats going on here is the customers browser as the page is loading they literally can select "M" (medium) and see it is selected(and technically it is) and yet when they hit add to cart the XS(extra-small) is what's actually added to the cart because it is the first item in the options and the currently selected one either in the theme, or what the javascript is set too when it loads just a bit before the AtC is hit.
This is most apparent when the variant parameter is missing or does not change i.e. product-name?variant=7654321
Other tests to run include disabling javascript to see what the behavior is when partially loaded, or fully loaded.
By partially loaded I mean making a selection and hitting the add to cart as soon as possible.
Or use developer tools to throttle the network connection to simulate a slow speed connection.
https://stackoverflow.com/questions/10328568/simulate-limited-bandwidth-from-within-chrome
And then for robustness doing the above with and without an adblocker running as this can be a factor too in javascript either not loading or being slow to load.
There's also doing the above with a fresh install of the theme with {{ content_for_header }} commented out to remove app interference as a suspect. Note: some apps autoinstall files directly to a theme when it's created making it harder to get a clean test /sigh.
FYI: There is no quantity shown on your cart page for items. If you do that on purpose and have a/b tested it as increasing conversions that is fascinating.
Contact [email protected] for the solutions you need
Save time & money ,Ask Questions The Smart Way
Problem Solved? ✔Accept and Like solutions to help future merchants
Answers powered by coffee Thank Paul with a ☕ Coffee for more answers or donate to eff.org
If you do the transition method, or disable the AtC before fully loaded be sure to document it LOUDLY so there's no surprises down the line such as customers not being able to add anything to the cart.
Contact [email protected] for the solutions you need
Save time & money ,Ask Questions The Smart Way
Problem Solved? ✔Accept and Like solutions to help future merchants
Answers powered by coffee Thank Paul with a ☕ Coffee for more answers or donate to eff.org
Hi Paul,
Thank you so much, I will try that out and get back to you.
Actually, the cart button is already hidden until the page is fully loaded, and I haven't been able to select a size and add to cart before it's fully loaded.
With Javascript disabled or an ad blocker, it also works fine.
Hi Michelle
I’m having the same problem for the past month. My top seller item is an acrylic frame. I have 30 sizes available. This week 2 return due to size in order wasn’t the size customer though they ordered. We are draining our profit with these returns.
Did you find a solution?
Thanks
Angel
Starting a B2B store is a big undertaking that requires careful planning and execution. W...
By JasonH Sep 23, 2024By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024