Product size defaulting to incorrect size when item added to the cart

Hi There

This is the second issue related to the “default shopify theme” when using a shopify app.

Each time my customers add 20g tester (size) of my product to their cart, it defaults to the 80g size instead - see here https://www.thecandlecreatornz.com/cart

As I want my customers to review their products on my site, I’ve downloaded your suggested “Product Review app” and followed the instructions /tutorial in your help centre including copying and pasting the code as per your instructions.

Please advise how this can be fixed.

FYI - Current situ - my menu bar is not working (due to Privy app) and now also the issue with the size selection.

If I knew that this “Debut /Default” theme would provide this my issues with shopify recommended, I would have chosen something else.

Thank you

Hello @DonneV ,

Issue is JS conflict in your theme.js. And not only wrong variants in cart but other features are also not working in your store like search, mobile hamburger, drop down menu click etc.
And this is neither with the app nor with the theme.
Issue is you added css in JS file check you theme.js under assets. You will find this css code there at botom.

/* Start */
.template-index .newsletter-section {padding-top: 0 !important;}
.template-index .newsletter-section .page-width {display: flex; align-items: center; justify-content: center;padding-top: 55px; padding-bottom: 55px;} 
.template-index .newsletter-section .page-width .section-header {margin-bottom: 0 !important;width: 60%;}
.template-index .newsletter-section .page-width .section-header h2.h2 {font-size: 16px !important;}
.template-index .newsletter-section .page-width .section-header .rte p {font-size: 14px !important;}
.template-index .newsletter-section .page-width .form-single-field {max-width: 100% !important; margin-bottom: 0 !important; margin-right: 0 !important; margin-left: 30px !important;width: 40%;}

@media only screen and (max-width: 749px) {
.template-index .newsletter-section .page-width {flex-direction: column;}
.template-index .newsletter-section .page-width .section-header, .template-index .newsletter-section .page-width .form-single-field {width: 100% !important;}
.template-index .newsletter-section .page-width .form-single-field {margin: 30px !important;}
.template-index .newsletter-section .page-width  {padding-bottom: 0px !important;}
}
/* End*/

Once found remove it and hopefully your issue will resolved.

Thanks

Do you know how I can correct this? The only time I’ve changed the code was
when I copied and pasted the code to install the apps :blush:

As I check now, variants are working properly. I mean correct variant added to the cart.
Also I checked that you removed the extra code from theme.js which I shared in my last reply.