Shopify themes, liquid, logos, and UX
Hi there,
I would like to use the "remaining quantitity" option in the Supply theme, BUT I want to show the remaining quantity only if there are less than 4 items left (not les than 10 as by default).
I changed the code product.template.liquid to < 4 (instead of < 10) here:
{% if section.settings.product_quantity_message%}
<span id="variantQuantity-{{ section.id }}" class="variant-quantity {% if variant.inventory_management and variant.inventory_quantity < 4 and variant.inventory_quantity > 0 %} is-visible{% endif %}">
{% if variant.inventory_management and variant.inventory_quantity < 4 and variant.inventory_quantity > 0 %}
{% assign qty = variant.inventory_quantity %}
{{ 'products.product.only_left' | t: count: qty }}
{% endif %}
</span>
{% endif %}
and also in the theme.js.liquid here:
if (variant.available) {
// We have a valid product variant, so enable the submit button
this.settings.selectors.$addToCart.removeClass('disabled').prop('disabled', false);
this.settings.selectors.$addToCartText.html({{ 'products.product.add_to_cart' | t | json }});
this.settings.selectors.$variantQuantity.removeClass('is-visible');
this.settings.selectors.$variantIncoming.removeClass('is-visible');
if (variant.inventory_management) {
// Show how many items are left, if below 10
if (variant.inventory_quantity < 4 && variant.inventory_quantity > 0 && this.settings.stockSetting == 'true') {
this.settings.selectors.$variantQuantity.html(theme.strings.product.only_left.replace('1', variant.inventory_quantity)).addClass('is-visible');
}
}
// Show next ship date if quantity <= 0 and stock is incoming
if (variant.inventory_quantity <= 0 && variant.incoming != null ) {
if (variant.next_incoming_date != null){
this.settings.selectors.$variantIncoming.html(theme.strings.product.will_be_in_stock_after.replace('[date]', variant.next_incoming_date)).addClass('is-visible');
}
}
} else {
Unfortunately the message "Only xx left!" is still shown for any quantity below 10 😞
Any ideas? Thanks!
Oh I didn't know there were 2 places to edit this ! I thought it was only in the product-template... But for me now I edited in the 2 files like you and it worked ! I replaced only the "10" by the value I wanted
In the theme.js.liquid you didn't change
Show how many items are left, if below 10
to say 4. You changed it in the line of code below. There are 2 places in the second section to change the number. I know this post is 3 years old, but I just was looking into this today and got it to work by changing the number in 3 places - 1 in the first section and 2 in the second. Hopefully this helps someone else!
User | RANK |
---|---|
235 | |
155 | |
60 | |
55 | |
47 |
Thanks to all who participated in our AMA with 2H Media on planning your 2023 marketing bu...
By Jacqui Mar 30, 2023Thanks to all Community members that participated in our inaugural 2 week AMA on the new E...
By Jacqui Mar 10, 2023Upskill and stand out with the new Shopify Foundations Certification program
By SarahF_Shopify Mar 6, 2023