Liquid, JavaScript, themes, sales channels
Hi all,
I need some assistance. I am using Dawn V2 and would like to add a Quantity Selector Button to the Featured Collection on the Homepage. There's a theme based Quantity Selector button for individual product pages. I want to insert this option on the homepage.
Please see photos below.
Any help or a point in the right direction would be massively appreciated!
In your featured-collection.liquid add checkbox type schema block: "Show Quantity' with id "quantity_selector"; after that go to your card-product snippet and add
{%- if 'quantity_selector' -%}
<div class="product-form__input product-form__quantity{% if settings.inputs_shadow_vertical_offset != 0 and settings.inputs_shadow_vertical_offset < 0 %} product-form__quantity-top{% endif %}" {{ block.shopify_attributes }}>
<label class="form__label" for="Quantity-{{ section.id }}">
{{ 'products.product.quantity.label' | t }}
</label>
<quantity-input class="quantity">
<button class="quantity__button no-js-hidden" name="minus" type="button">
<span class="visually-hidden">{{ 'products.product.quantity.decrease' | t: product: product.title | escape }}</span>
{% render 'icon-minus' %}
</button>
<input class="quantity__input"
type="number"
name="quantity"
id="Quantity-{{ section.id }}"
min="1"
value="1"
form="{{ product_form_id }}"
>
<button class="quantity__button no-js-hidden" name="plus" type="button">
<span class="visually-hidden">{{ 'products.product.quantity.increase' | t: product: product.title | escape }}</span>
{% render 'icon-plus' %}
</button>
</quantity-input>
</div>
{%endif%}
Thanks Jenny. That has worked but it has not accounted for the image banners and there is an overlap on the homepage.
Please see below. Do you have any suggestions for sorting the layout?
Could you send your store URL? 🙂
Hi, inserted this code into main-collection-product-grid.liquid. Looks great and allows customer to select qty, but that qty not reflected in cart when they hit "add to cart'. Product inserted, but always just qty 1. Using latest Dawn. Any ideas?
User | RANK |
---|---|
38 | |
29 | |
13 | |
12 | |
9 |
On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023The year-end shopping season is just around the corner. Is a flash sale on your radar? Are...
By Jasonh Nov 6, 2023