I've been spending hours to try to figure it out + forum, so next step is to post my problem! :)
So what I want to do is to display a message to my user in my cart.js. They are allowed to order when the product is "out of stock" but I want to display a message on my cart.js saying 2/3 weeks delivery.
I tried to add that in my cart.liquid :
bkseen
<p class="cart-item__variant"> {{ line_item.variant.inventory_quantity }}</p>
{% assign lineItemVariant = line_item.variant %}
{% if lineItemVariant.inventory_management == "shopify" %}
<span class="delivery-message">
{% if lineItemVariant.inventory_quantity > 0 %}
Quick delivery
{% else %}
2-3 weeks delivery
{% endif %}
</span>
{% endif %}
I've tested the code above and the result is pretty weird.
If I put the quantity in my table between <td></td>, that automatically format every values as the last one. I guess it's because of Rivet.js mixing data on the back.
And if I put the code out of <td> tags it works perfectly.. the thing is, I want to display it for each line, that's the point !
Check the result by a screenshot :
HERE
If you have any question do not hesistate.
Cheers
bkseen
Related
I want to add some additional content under shipping method on Shopify checkout page.
same like this.
My ref Site
https://www.thegldshop.com
enter image description here
For this, I found this article and added this script
https://help.shopify.com/en/manual/orders/status-tracking/customize-order-status/show-content-based-on-shipping-method
{% if checkout.shipping_method.title != 'Pick-up at the store' %}
Shopify.Checkout.OrderStatus.addContentBox(
`<p>Okay, we're ready for you to collect your products from 17 Mapple Crescent, Toronto. Our store is open 9:00 to 5:00 every day.</p>`
)
{% endif %}
But still not working for me.
Here is my website url
https://hypeyourbeast.com/
In Shopify, You will need Shopify plus account to do any change on the checkout page. Without a Shopify Plus account, you can't change anything on the checkout page.
You can modify the Thank You / Orders page in checkout without Shopify Plus. Plus is required to edit checkout for any step prior to "thank you".
Add tags around your code in the additional scripts area. This code worked for me:
<script>
// DEBUG {{ checkout.shipping_method.title }} has been used
{% if checkout.shipping_method.title != 'Pick-up at the store' %}
Shopify.Checkout.OrderStatus.addContentBox(
`<p>Added content box {{ checkout.shipping_method.title }}</p>`
)
{% endif %}
</script>
I want to add the price within the button "add to cart".
As you can see I am able to add the price within the button but when i change the variant it disappears. (the URL changes along with selecting a different varient)
GIF that shows the problem
Any suggestions?
The current code is:
<button
{% if product.empty? %}type="button"{% else %}type="submit"{% endif %}
name="add"
id="AddToCart-{{ section_id }}"
class="btn btn--full add-to-cart{% if enable_dynamic_buttons %} btn--secondary{% endif %}"
{% unless current_variant.available %} disabled="disabled"{% endunless %}>
<span id="AddToCartText-{{ section_id }}" data-default-text="{{ default_text }}">
{{ button_text }} {{ current_variant.price | money }}
</span>
</button>
The answer is to use Javascript. When you render your page for the first time, Liquid rendering places a price on the button. But when you change a variant, no Liquid is rendering, so you're left with using Javascript. I am sure that by now, after 10+ years you can find some examples out there that do what you need done.
When a variant changes, usually some Javascript runs that "knows" the variant, and hence it's price, so the only challenge is to find the old price on the button, and overwrite it. Simple stuff usually.
Good time of day.
Trying to improve the pop-up cart was stuck on the possibility of using custom values instead of existing ones.
This example works as expected:
$.getJSON('/cart.js').then(
function(cart) {
$('#example').html(theme.Currency.formatMoney(cart.total_price, theme.moneyFormat));
});
In the cart template, I have made other values by liquid codes. Here is an example:
{% for item in cart.items %}
{% assign totalfive = 0 %}
{% assign fiveminus = cart.total_price | times: 0.05 %}
{% assign totalfive = cart.total_price | minus: fiveminus %}
{% endfor %}
In HTML, this value looks like this: <span>{{ totalfive | money }}</span>
The question is about how can I get this value by JSON? Maybe there is a way to catch it with an element based on ID? Or it definitely impossible?
I am trying to show blog posts on product pages by matching their tags. I have this code, but the problem is it's fetching only the latest 50 posts. How can I loop through all articles?
{% for article in blogs.news.articles %}
{% for tag in product.tags %}
{% if article.tags contains tag %}
{{ article.title }}
{% endif %}
{% endfor %}
{% endfor %}
Shopify have a limit of 50 items per loop for collections and blogs. This means that you can't go outside those limitations.
This limitation is set in order to keep the requests to their server as small as possible.
So the short answer is that you can't loop more than 50 articles or products.
How to load http://example.myshopify.com/collections/all content
to my shopify frontpage http://example.myshopify.com/
I figured out a way that I hardcode <script>window.location.href='collections/all'</script> on index.liquid, but I'm pretty sure thats' not a clean way.
and I try to copy whole collection.liquid's code to index.liquid, but it prompt me Liquid error: Array 'collection.all.products' is not paginateable. error and no product showing the index.liquid page.
Any idea how to load collections/all on shopify's front page?
I'm using Timber Framework as people recommend to start to build a theme
inside
In the Timber framework, you could change this line in index.liquid:
{% for product in collections.frontpage.products limit:4 %}
to:
{% for product in collections.all.products %}
Depending on how many products you have, you probably still want to limit how many are displayed, or paginate the output.
E.g.
{% paginate collections.all.products by 12 %}
{% for product in collections.all.products %}
...
{% endfor %}
{{ paginate | default_pagination }}
{% endpaginate %}
You include this:
{% for product in collections.all.products %}
// here you have access to each product
{% endfor %}
This will loop all of your products.
You can review http://cheat.markdunkley.com/ what product variables you have access to in that loop.