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 |
---|---|
169 | |
151 | |
70 | |
46 | |
34 |
Thanks 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, 2023One of the key components to running a successful online business is having clear and co...
By Ollie Mar 6, 2023