How To Remove Quantity Selector In Cart? Custom Theme

Solved

How To Remove Quantity Selector In Cart? Custom Theme

dzhundzhun
Visitor
2 0 2

Hello!

 

It is possible to disable quantity selection in the product itself with one button, but disabling quantity selection in the cart has become a big problem for me. I searched the forum, which showed how to do it through the website code, even though I am not really familiar with coding, but unfortunately, I couldn't find the right sections in my website (base.css, main-cart-item.liquid). I have disabled the option to create a cart(skipping the add-to-cart option, only 'buy now') - so that the customer is immediately redirected to check-out, however it is possible to exit the check-out even afterwards, to select the quantity already in the cart.

 

I would like to make it so that in the cart there is no possibility to choose the quantity, or that the maximum quantity is 1.

Ideally, I would like to understand how to save the cart, so that it can add several variations of the product, but only in 1 piece: let's say the product comes in white and black colors and you can add to the cart only 1 piece of white and 1 piece of black color, or just buy 1 piece of white or 1 piece of black color, and you can not increase the quantity.

dzhundzhun_0-1705361425500.png

 

 

website: https://radiantglowtest.myshopify.com/

link to the websites cart: https://radiantglowtest.myshopify.com/cart 

password: rtiasu

Accepted Solution (1)

yashgarg
Shopify Partner
102 26 38

This is an accepted solution.

Hey @dzhundzhun ,

 

If you just want to remove the quantity selector, there is a easy way to do that.

Please follow the following steps

1) Go to your online store and select Themes from left panel

2) Press 3 dots menu in center (on the left of Customize button) and then Edit Code

3) Open the file like theme.scss.css or theme.scss (you can search for it)

4) Search for css selector .qty-container

5) You will see a property - display: block; instead of block make it none. so final property should look like display: none;

 

Thanks

Yash Garg

 

If this works for you, please give it a like and mark it as the solution! Thanks 🙂
Feel free to contact me for Shopify tech support
Email: yashgarg.tech@gmail.com

View solution in original post

Replies 4 (4)

EasifyApps
Shopify Partner
635 19 52

Hi @dzhundzhun,

I suggest exploring Order Quantity Limits apps. These apps can be instrumental in restricting the purchase quantity for each product to just 1, ensuring that customers are unable to select more than one item per product.

Easify Product Options: Any product options app can help you create custom options, but Easify turns those options into sales and conversions!
Easify Inventory Sync: Automate inventory syncing for Bundles, Duplicates, and Raw Materials. Say goodbye to manual tracking headaches.
Easify Product Attachments: Enrich your store with downloadable content. Easily add PDFs and other files to product or any page.
>>> Try Apps for Free | 24/7 Live Chat Support

yashgarg
Shopify Partner
102 26 38

This is an accepted solution.

Hey @dzhundzhun ,

 

If you just want to remove the quantity selector, there is a easy way to do that.

Please follow the following steps

1) Go to your online store and select Themes from left panel

2) Press 3 dots menu in center (on the left of Customize button) and then Edit Code

3) Open the file like theme.scss.css or theme.scss (you can search for it)

4) Search for css selector .qty-container

5) You will see a property - display: block; instead of block make it none. so final property should look like display: none;

 

Thanks

Yash Garg

 

If this works for you, please give it a like and mark it as the solution! Thanks 🙂
Feel free to contact me for Shopify tech support
Email: yashgarg.tech@gmail.com
dzhundzhun
Visitor
2 0 2

U r the legend bro!

Octavian
Visitor
2 0 0

Hey, I would like to do the same but my theme doesn't have any scss file, I use Shrine Pro theme. Do you have any idea what file should I search for? I found this: 

 

.quantity__rules-cart .loading-overlay:not(.hidden) ~ *, .visibility-hidden,