Need to hide "Quantity" "number" selector

Shopify Discussion
1

Hi,

I my company sells Computer Apps. We do not need to allow customers to change the “quantity”, we just want it fixed at “1” … as they can only download one copy of the software at a time.

Someone else helped me remove the word “quantity”, which was successful. However it still shows the “number”, which customers can change:

https://i-live-on.com/products/creator-app-p?variant=39466980114489

How can I hide the “number” and leave it fixed at “1” please?

Thanks,

Brad

1 Like
2

Hello @TIMECAPSULES

if you want hide quantily, you can use code this:

.product-option-quantity-label,
#default-variant-quantity-input{display:none!important;}

and put it at bottom file theme.css

I hope it can help you

thank you

3

Hi [email removed]I-LIVE-ON,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.css

Step 3: Paste the below code at bottom of the file → Save

.product-details .product-option-quantity{display:none !mportant}

Hope my solution works perfectly for you!

Best regards,

Victor | PageFly

4

Hi @TIMECAPSULES ,

Glad to support you today.

You can check out my suggestion below to get your concern resolved:

  1. Go to Edit code on Online Store:

GemPages_0-1676534292192.png
GemPages_0-1676534292192.png400×163 25.3 KB

  1. add my code above the tag on Theme.liquid:

I hope you find the answer helpful.

Kind & Best regards,
GemPages Support Team.

5

Hi Brad

If you add the following to the end of your theme.css file:

.product-options label.product-option-quantity-label {
    display: none;
}

@media (min-width: 770px) {
     .product-options label.product-option-quantity-label {
        display: none;
    }   
}

input#default-variant-quantity-input {
    display: none;
}

You should then see those numbers and related items removed.

Let us know if that works?

6

Hi,

I only have a theme.css.liquid … so I tried that.

I pasted your suggested code at the bottom, just before /* end */

Unfortunately it didn’t work.

I look forward to hearing from you :slightly_smiling_face: please.

Thanks,
Brad

7

Hi,

I tried this idea … it doesn’t work. I believe there needs to be a
change in the html code to make the change happen.

Thanks any for your input.

Brad

8

Hi 2BDigital,

This works for 3 of my App products as you can see below:
https://i-live-on.com/products/creator-app-p?variant=39466980114489
https://i-live-on.com/products/nowstory-player-app?variant=40115104088121
https://i-live-on.com/pages/vr-theater-player-app
THANK YOU …

However … it doesn’t work for any of the 4 variants of the LifeStory
Service:
https://i-live-on.com/collections/lifestory

Is there a possible fix for this as well please?

Thanks,
Brad

9

Hello @TIMECAPSULES ,

you can add code this at bottom file theme.css

.product-options .product-option-quantity{display:none}

yo will hide quantity on site

thank you

10

Hi @TIMECAPSULES

The additional code that you’ll need for those extra variants, which are configured slightly differently is below.

Please add the following extra lines to the bottom of your theme.css file:

.product-options-default-only label.product-option-quantity-label {
    display: none;
}
.product-options-default-only input.product-option-quantity {
    display: none;
}

That should apply the same change to your other variants.

Hope that helps!

11

Thanks to 2BDigital - this works.

I will hit the “Accepted as Solution” button for this item, and the other
item as well.

Regards,
Brad

1 Like