A Guide for Customizing Dawn: Limit Cart Selector on Product Page to Existing Inventory Level

[TheJunkGuru]

So I give this guide freely for a couple of reasons. One, as I opened my new store, I was absolutely slammed with requests from "Experts" via all of my customer channels offering to fix things that weren't wrong with my store. This specific fix is likely one they get people on pretty frequently. It's listed as an Unsupported Customization by Shopify Support (fair enough!) so I wanted to provide a guide mostly because of the sheer amount of spam (120+ requests) I got from these people.

Also, I like being helpful 🙂 Disclaimer: Always edit code on a test / non-live theme. Test thoroughly for your own use case & existing customizations & theme version before pushing live. This guide is for Dawn 15.2 and was effective as of February 12, 2025. Also, if you're not comfortable in working with liquid, feel free to consult one of those experts. The real ones are very helpful, great at what they do, and excellent resources. For those of you Experts that fall into this legitimate and helpful category, my apologies for sharing this publicly. Blame those that spammed me so thoroughly.

Actual Guide:

We'll be editing code for a non-live theme (and testing it before going live! QA suggestions at bottom) by going to Admin > Online Store > and selecting your newly installed (preferably) Dawn theme. This can be applied to heavily customized theme's, but your mileage may vary if you've edited any of the same places this customization targets to a significant degree.

• Once you've found the theme you'd like to edit the code for, click the three little horizontal dots > Edit Code
• Search for main-product.liquid
• Click anywhere inside the code with one left-click. Now press ctrl+f or cmd+f (on mac) to open the search button for the code itself (not your browser search). Search max=" as your query. You're looking for a function that looks like the below pre-modification:

<input
                        class="quantity__input"
                        type="number"
                        name="quantity"
                        id="Quantity-{{ section.id }}"
                        data-cart-quantity="{{ cart_qty }}"
                        data-min="{{ product.selected_or_first_available_variant.quantity_rule.min }}"
                        min="{{ product.selected_or_first_available_variant.quantity_rule.min }}"
                        {% if product.selected_or_first_available_variant.quantity_rule.max != null %}
                          data-max="{{ product.selected_or_first_available_variant.quantity_rule.max }}"
                          max="{{ product.selected_or_first_available_variant.quantity_rule.max }}"
                        {% endif %}
                        step="{{ product.selected_or_first_available_variant.quantity_rule.increment }}"
                        value="{{ product.selected_or_first_available_variant.quantity_rule.min }}"
                        form="{{ product_form_id }}"
                      >

• If you've got an unedited original file of the above Dawn version, it should be line 272. You're now inside the function we want to modify.
• We want to modify the entire snippet inside the <input and > tags. It's should be between line 263 - 278. We should change it to the below:

                      <input
                        class="quantity__input"
                        type="number"
                        name="quantity"
                        id="Quantity-{{ section.id }}"
                        data-cart-quantity="{{ cart_qty }}"
                        data-min="{{ product.selected_or_first_available_variant.quantity_rule.min }}"
                        min="{{ product.selected_or_first_available_variant.quantity_rule.min }}"
                        {% if product.selected_or_first_available_variant.inventory_management %}
                          data-max="{{ product.selected_or_first_available_variant.inventory_quantity }}"
                          max="{{ product.selected_or_first_available_variant.inventory_quantity }}"
                        {% endif %}
                        step="{{ product.selected_or_first_available_variant.quantity_rule.increment }}"
                        value="{{ product.selected_or_first_available_variant.quantity_rule.min }}"
                        form="{{ product_form_id }}"
>​

• As we can see, we've added a condition to more gracefully check inventory. We've also set max to the current stock level.

I'm by no means a Liquid pro, but I've fully tested this, ran it by ChatGPT o3-mini-high for validation, and tested the product pages on the entire theme.

I then made customizations on Prestige in a similar way in a different file with a very simple else statement. Not really wanting to undercut the actual Experts too hard by sharing that customization in more detail, but could probably be convinced to share it based on community feedback.

Hope guides like this help and am open to feedback on if there's a better board or spot to share them!