Please prompt users to select the variant first, instead of pre-selected. The original image, feature image, and the promo (ad copy) image may contain a variant that ultimately leads the user to want that particular variant.
But when they are at the product page, the variant is pre-selected first and a high chance it's not the variant at all, as well as users overlooking the size selection. This leads to confusion, and if the users finally realize they got the wrong variant, they will delete it from cart and may even lose them because they got frustrated. In other instance, the user gets the wrong item shipped because they didn't pay attention to what he selected.
Here's a few things that i found. I don't have proper skills to implement it myself, so i think you should implement it on your end.
http://formvalidation.io/examples/bootstrap-select/
https://jqueryvalidation.org/required-method/
But when they are at the product page, the variant is pre-selected first and a high chance it's not the variant at all, as well as users overlooking the size selection. This leads to confusion, and if the users finally realize they got the wrong variant, they will delete it from cart and may even lose them because they got frustrated. In other instance, the user gets the wrong item shipped because they didn't pay attention to what he selected.
Here's a few things that i found. I don't have proper skills to implement it myself, so i think you should implement it on your end.
http://formvalidation.io/examples/bootstrap-select/
https://jqueryvalidation.org/required-method/