How can I limit product quantity in the Impulse theme?

[SunShopp]

We Just switched to the Impulse theme and cannot figure out how to limit the maximum quantity a customer can select for a given product to what we currently have in stock.

Any help is appreciated.

Thank you

Store URL:

https://thesunshopp.com/

[LitExtension]

Hi @SunShopp,

If your product does not have a variant, you can add the following code:

Go to snippets > quantity-input.liquid file and add code: https://i.imgur.com/c63A8Uo.png
max="{{ product.selected_or_first_available_variant.inventory_quantity }}"

If your product has multiple variants, it will be a complex requirement and you need to change it with JS too. So you need to hire an expert for it.

Please visit: https://community.shopify.com/c/Shopify-Ecommerce-Jobs/bd-p/shopify-job-board

Hope it helps!

If my answer can help you solve your issue, please mark it as a solution. Thank you and good luck.

[SunShopp]

This did not resolve the issue.

[LitExtension]

Hi @SunShopp ,

Sorry, quantity is still changing in JS, so you need to change more code in theme.min.js file.
Go to Assets > theme.min.js , find '.js-qty__adjust--minus' and add code here:
https://i.imgur.com/kSNaywk.png , Code: this.maxValue = this.input.getAttribute("max") || 1
Find 'this._change(this._getQty())' and change code:

this._change(this._getQty())
=>
var e = this._getQty();
if (e >= this.maxValue) {
  e = this.maxValue;
}
this._change(e);

Refer https://i.imgur.com/iuTVt0w.png
Hope it helps!

[SunShopp]

When I make those edits images don't load and the quantity wont change past 1.

[LitExtension]

Hi @SunShopp ,

It may be because your JS change is not correct, can you send me the whole changed code. I will check it.

[SunShopp]

First Part:

function n(n,s){this.wrapper=n,this.plus=n.querySelector(t),this.minus=n.querySelector(i),this.input=n.querySelector(e), this.maxValue = this.input.getAttribute("max") || 1,this.minValue=this.input.getAttribute("min")||1;var o={namespace:null,isCart:!1,key:this.input.dataset.id}

Second Part:

return n.prototype=Object.assign({},n.prototype,{init:function(){this.plus.addEventListener("click",function(){var e=this._getQty();this._change(e+1)}.bind(this)),this.minus.addEventListener("click",function(){var e=this._getQty();this._change(e-1)}.bind(this)),this.input.addEventListener("change",function(e){this._change(this._getQty())=>var e = this._getQty();if (e >= this.maxValue) {e = this.maxValue;}this._change(e);}.bind(this))

thank you

[LitExtension]

Hi @SunShopp ,

You changed it wrong, please change:

First Part:

function n(n,s){this.wrapper=n,this.plus=n.querySelector(t),this.minus=n.querySelector(i),this.input=n.querySelector(e), this.maxValue = this.input.getAttribute("max") || 1, this.minValue=this.input.getAttribute("min")||1;var o={namespace:null,isCart:!1,key:this.input.dataset.id}

Second Part:

return n.prototype=Object.assign({},n.prototype,{init:function(){this.plus.addEventListener("click",function(){var e=this._getQty();this._change(e+1)}.bind(this)),this.minus.addEventListener("click",function(){var e=this._getQty();this._change(e-1)}.bind(this)),this.input.addEventListener("change",function(e){var e = this._getQty();if (e >= this.maxValue) {e = this.maxValue;}this._change(e);}.bind(this))

Hope it clear to you.

[SunShopp]

The page loads regularly with the new code but the quantity is still not being limited.

[LitExtension]

Hi @SunShopp ,

Please create staff account with email: namphan992@gmail.com

I will check it for you.

[LitExtension]

Hi @SunShopp ,

Please change 'Second Part:'

return n.prototype=Object.assign({},n.prototype,{init:function(){this.plus.addEventListener("click",function(){var e = this._getQty();if (e >= this.maxValue) {e = this.maxValue;}this._change(e);}.bind(this)),this.minus.addEventListener("click",function(){var e=this._getQty();this._change(e-1)}.bind(this)),this.input.addEventListener("change",function(e){var e = this._getQty() + 1;if (e >= this.maxValue) {e = this.maxValue;}this._change(e);}.bind(this))

[SunShopp]

With that change the quantity selector wont go above 1.

[LitExtension]

Hi @SunShopp ,

Please create staff account with email: namphan992@gmail.com

I will check it for you.

[LitExtension]

Hi @SunShopp ,

I checked and this JS function is called in many places, so if possible please create staff account, I will help you debug and rewrite it.

[SunShopp]

Sorry for the delay. We will actually be bringing things in house.

Thank you for your time.

[LitExtension]

Hi @SunShopp,

I saw you liked my answer. If it helped you solve your issue, please mark it as a solution. Thank you and good luck.

[designrepo]

Hey, Could you please help me with Dawn theme?

Please help me.!

Thanks!

[Thesunshopp]

insert the following:

max="{{ product.selected_or_first_available_variant.inventory_quantity}}"

into your main-product-liquid code editing section, approx. line 284, so it looks like the screenshot below.

 

[designrepo]

Hello, @LitExtension 

Can you please help me with Dawn theme?

Thank you!

[magecomp]

Hello @SunShopp 

Our simple app can help you to fulfill your requirements

https://apps.shopify.com/purchase-limit?
https://apps.shopify.com/limit-sales-per-day? 

[janvi_22]

Hey @SunShopp,

I understand your query. I can suggest you one extension called Limit Quantity Purchase

The features of this app are as below: 

1. Specific Product purchase limits Minimum and Maximum.

2. Flexible Purchase Limit of items within a group of products.

3. Apply Limit For individual products or collection

It has all the features that you have mentioned in your query. Please, check it out here for more details: Shopify Limit Qty Purchase

Hope this helps you. 

Thank you.