Minimog theme - How to add quantity selector and add to cart button on collection page

Shopify Discussion
1

Minimog theme -

I want to add quantity selector and add to cart button on collection page for minimog theme. Currently is shows ‘Select Options’ which opens a popup for product.

I want the user to use be able to select quantity and size option on the collection page and click on add to cart button to complete the transaction

2023-05-18_11-15-39.png
2023-05-18_11-15-39.png1269×165 9.27 KB

2

Now, follow these steps to add the quantity selector and “Add to Cart” button:

  1. Locate the “collection-template.liquid” file in the “Sections” or “Templates” folder (this might vary depending on your theme). If your theme doesn’t have a specific collection template, you can modify the “product-grid-item.liquid” file instead.
  2. Open the file and find the section of code that generates the product listing or grid.
  3. Within the loop that displays each product, add the following code snippet before the closing </a> tag:

​

The above code snippet adds a form with an input field for the quantity selector and a submit button for adding the product to the cart. The action="/cart/add" specifies the URL where the form data will be sent when the user clicks “Add to Cart.” The value="{{ product.variants.first.id }}" sets the variant ID for the product being displayed. The min="1" attribute on the input field ensures that the user can only select a quantity greater than or equal to 1.