Shopify themes, liquid, logos, and UX
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
Hi there!
i would like to add a line of shipping rate into the cart drawer. Can someone help?
I dont want to use a app because it should be code.
Shoul be like this:
Price
Shipping price (if price is under 299€ then 4,99€ and if more than 299€ free)
Total Price (sum of Price+Shipping)
Solved! Go to the solution
This is an accepted solution.
Hi,
It's not really that complicated. First, you need to find the cart drawer file, I would dare to say that it's located in the snippets folder, and it must be called cart-drawer.liquid, however, file names depend on your theme.
Open that file and find the place of the HTML doc where you want to place the code so that it renders correctly on screen.
Build the HTML structure and style it with CSS.
Then you may include the LIQUID logic. Would be something like this (not exactly it, but this is how the logic goes):
<div class="container">
<p>price:</p>
<p>{{product.price}}</p>
<p>Shipping Price</p>
<p>{% if product.price < 299 %}{{checkout.shipping_price}}{% elsif product.price > 299 %} Free {%endif%}</p>
<p>Total Price:</p>
<p>{{checkout.total_price}}</p>
<div>
That's it.
Hope that's helpful.
This is an accepted solution.
Hi,
It's not really that complicated. First, you need to find the cart drawer file, I would dare to say that it's located in the snippets folder, and it must be called cart-drawer.liquid, however, file names depend on your theme.
Open that file and find the place of the HTML doc where you want to place the code so that it renders correctly on screen.
Build the HTML structure and style it with CSS.
Then you may include the LIQUID logic. Would be something like this (not exactly it, but this is how the logic goes):
<div class="container">
<p>price:</p>
<p>{{product.price}}</p>
<p>Shipping Price</p>
<p>{% if product.price < 299 %}{{checkout.shipping_price}}{% elsif product.price > 299 %} Free {%endif%}</p>
<p>Total Price:</p>
<p>{{checkout.total_price}}</p>
<div>
That's it.
Hope that's helpful.
Thanks!