Adding a quantity button on product page

Store Design
, , ,

Topic summary

A user running Dawn theme version 15.3 wants to add a quantity selector to their product pages so customers can purchase more than one item at a time.

Recommended solution (no code required):

  • Navigate to Online Store → Themes → Customize
  • Select Products → Default product from the top dropdown
  • Click Product information in the left sidebar
  • Toggle on “Show quantity selector”
  • Save changes

This enables “– / +” buttons for customers to adjust quantity before adding items to cart.

Alternative code-based method:
If the toggle option doesn’t work, another user provided manual code insertion instructions:

  • Edit main-product.liquid in the theme code editor
  • Locate the product form element
  • Insert a quantity selector <div> block above the “Buy buttons” section
  • Save and test

The discussion remains open pending confirmation from the original poster on whether either solution worked.

Summarized with AI on October 23. AI used: claude-sonnet-4-5-20250929.
1

Using DAWN theme,
How would I add a quantity button so people could add more product to their cart if they’re wanting more then the 1 of the item?

2

In the Dawn theme, the quantity selector is usually built in — but if it’s missing, here’s how to add it:

:magic_wand: Steps:

  1. Go to Online Store → Themes → Customize.

  2. Open a Product Page.

  3. On the left panel, click Product information.

  4. Scroll down and enable “Quantity selector” (there’s a toggle for it).

  5. Click Save.

That’s it — now customers can choose the quantity before adding to cart.

If you don’t see that option, tell me your Dawn theme version, and I’ll give you the code method instead.

4

it’s version 15.3 thank you

5

In Dawn 15.3, you don’t need any code — Shopify already includes the quantity selector option.

Just do this:

Go to Online Store → Themes → Customize.

From the top dropdown, select Products → Default product.

In the left sidebar, click Product information.

Scroll down and toggle on “Show quantity selector.”

Click Save.

Now customers will see “– / +” buttons to adjust quantity before adding to the cart.

if this does not work tell me JGBowie

6

Hi @JGBowie,

1. Go to Online Store → Theme → Edit code.
2. Open your main-product.liquid file.

Inside the main-product.liquid file, you need to find the product form element.

{%- form 'product', product, id: product_form_id, class: 'form', novalidate: 'novalidate', data-type: 'add-to-cart-form' -%}

Insert the Quantity Selector Code:

Directly above the block of code for the “Buy buttons” (which usually starts with

), you will add the code for the quantity selector.

<div class="product-form__input product-form__quantity">
  <label for="Quantity-{{ section.id }}" class="form__label">
    {{ 'products.product.quantity.label' | t }}
  </label>
  <input type="number" id="Quantity-{{ section.id }}"
         name="quantity" value="1" min="1" class="quantity__input"
         aria-label="{{ 'products.product.quantity.input_label' | t: product: product.title | escape }}">
</div>

Click Save and try.

Thank you!