Shopify themes, liquid, logos, and UX
Hi guys,
I want to make the default quantity in the selector to be 3 when people enter a product page.
How can I do so?
Thanks
Hi @JesusGomicare,
Please go to Actions > Edit code > Sections > main-product.liquid file, find 'quantity__input' and change code here:
Code:
{{ product.selected_or_first_available_variant.quantity_rule.min }} => 3
Hi @JesusGomicare,
Have you tried testing it?
Your means here is when user click to plus button quantity a product so instead of increase 1 you need increase 3 for each change quantity, right?
To do this you need change increment step for input field.
You can do that by modifying min value in the quantity input on your product page template liquid code. Example like in this image below (Dawn theme)
- Helpful? Like and Accept solution! Support me: Buy coffee
- Ryviu - Reviews & QA app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
Hi Dan,
Thanks for the the help!
This works, but doesn't allow to go below 3. I want the default to be 3, but to also be able to go 1.
Any ideas on how to do so?
Please change the code to original and add this code at the bottom of your main-product.liquid file
<script>
document.addEventListener('DOMContentLoaded', function() {
var quantityInput = document.getElementById('Quantity-{{ section.id }}');
if (quantityInput) {
quantityInput.value = 3;
}
});
</script>
- Helpful? Like and Accept solution! Support me: Buy coffee
- Ryviu - Reviews & QA app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
Hi @JesusGomicare,
Follow these Steps:
1) Go to Online Store
2) Edit Code
3) Find product-info.js file
4) Add the following code in the function setQuantityBoundries
Code: (Some conditions to guarantee satisfy quantity rules if exist)
// This customize can be removed anytime
if (min < 3 && (max == null || max >= 3)) this.quantityInput.value = 3;
// end
Changes:
If our suggestions are useful, please let us know by giving it a like, marking it as a solution.
BSS: B2B Wholesale Solution |BSS: B2B Portal, Quote, Net 30 | B: B2B Lock Password Protect
Need help from our expert? Kindly share your request with us via community@bsscommerce.com
Hi @BSSCommerce-B2B,
Thanks for your help! Sadly enough, this doesn't work.
Any ideas on how to fix it?
HI @JesusGomicare,
Your Dawn is using a different variable name for mine. You can try this code instead
// This customize can be removed anytime
if (min < 3 && (max == null || max >= 3)) this.input.value = 3;
// end
If our suggestions are useful, please let us know by giving it a like, marking it as a solution.
BSS: B2B Wholesale Solution |BSS: B2B Portal, Quote, Net 30 | B: B2B Lock Password Protect
Need help from our expert? Kindly share your request with us via community@bsscommerce.com
We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024Thanks to everyone who participated in our AMA with 2H Media: Marketing Your Shopify St...
By Jacqui Sep 6, 2024The Hydrogen Visual Editor is now available to merchants in Shopify Editions | Summer '...
By JasonH Sep 2, 2024