Shopify themes, liquid, logos, and UX
Hi!
I want to show a simple line of text that gives an indication for delivery times for my products.
I have already made a new product-template and used the code from the existing product-template but my experience only goes as far as HTML and CSS so I am not quite sure what I am looking for in the code.
I want to activate the 'sold-out' label when the product is in stock, then change the 'sold-out' text to for example 'delivery: 2-3 days' and then I want to edit the color and border of the label.
Could anyone point me in the right direction?
Thanks 🙂
Hii, @asafari
Kindly share your store URL so,
I can solve it perfectly.
Thank You.
Hi @asafari,
What theme are you using? Please send me the theme name.
Or send me the code of product-template.
I will check it.
Hi @asafari,
Please go to product file, find 'products.product.add_to_cart' and change code: https://i.imgur.com/hMBuOwd.png
<span id="addToCartText-{{ section.id }}">{{ 'products.product.add_to_cart' | t }}</span>
=>
<span id="addToCartText">delivery: 2-3 days</span>
Hope it helps!
Hi,
I'm so sorry, I am using Debut not Supply.
My bad!
Hi @asafari,
- Please go to product file, find 'products.product.add_to_cart' and change code: https://i.imgur.com/BMM2x6Z.png => https://i.imgur.com/PIdUqvu.png
Code:
<span data-add-to-cart-text="true">
delivery: 2-3 days
</span>
- Go to assets/theme.js file, find '_updateAddToCart: function()' and add code: https://i.imgur.com/bhrnwGV.png
Code:
if(this.addToCartText.dataset.addToCartText == 'true'){
this._enableAddToCart('delivery: 2-3 days');
return;
}
Hope it is clear to you.
Kindly share me your store URL for help
beauforthardware.nl
Hi @asafari,
Have you tried following my instructions? I have tested it on my demo and it works fine.
Yes it worked but it was not really what I was looking for, I wanted to make a separate template so I can address individual products and I want it to be a separate text, so I want to activate the 'sold out' tag while to product isn't sold out and then I want to change that text to say 2-3 days.
Hi,
If you want to create a template, please follow the instructions:
- Step 1: Go to Actions > Edit code > Add a new template: https://i.imgur.com/ONwrKaZ.png
- Step 2: Customize the code for the newly created template with my previous tutorial
- Step 3: Choose the newly created template for the products. https://i.imgur.com/R89pHdF.png
Hope it helps!
What I am trying to achieve is this in the picture.
But the delivery text is on the bottom left corner for some reason and I don't think it'll be dynamic, haven't tried it on mobile yet.
The picture
Hi @asafari,
I did not receive the image, can you re-upload it?
Hi @asafari,
Can you send me screenshot with description on it. I will check it.
User | RANK |
---|---|
69 | |
65 | |
63 | |
53 | |
49 |
We're excited to announce improvements to the threaded messaging experience in our communi...
By TyW May 31, 2023Thank you to everyone who participated in our AMA with Klaviyo. It was great to see so man...
By Jacqui May 30, 2023Photo by Marco Verch Sales channels on Shopify are various platforms where you can sell...
By Ollie May 25, 2023