Free shipping threshold Shopify

Snippet file

{% comment %}
  Renders free shipping message

  Accepts:
  - minimum_amount: {Number} Free shipping minimum amount

  Usage:
  {% render 'free-shipping', minimum_amount: minimum_amount %}
{% endcomment %}

{% liquid
    assign minimum_amount_in_cents = minimum_amount | times: 100
    assign total_price = cart.total_price
%}

<div class="drawer--amf free--shipping d-flex-col {% if cart == empty %}cart--drawer--empty{% endif %}">
    {%- if total_price >= minimum_amount_in_cents -%}
        <span class="free-shipping__text free-shipping__text--success">free US shipping</span>

    {%- else -%}
        {%- capture remaining_amount -%}<price-money class="price"><bdi>{{ total_price | minus: minimum_amount_in_cents | abs | money }}</bdi></price-money>{%- endcapture -%}
        <span class="free-shipping__text">Spend {{remaining_amount}} more to enjoy Free Shipping</span>
    {%- endif -%}
    {%- capture progress_percent -%}{{ total_price | times: 1.0 | divided_by: minimum_amount_in_cents | at_most: 1 | times: 100 | round }}%{%- endcapture -%}
    <span class="free-shipping__progress" style="--progress: {{ progress_percent }};">
        <span class="free-shipping__data--progress">{{- progress_percent -}}</span>
    </span>
</div>

Setting schema json file

{
        "type": "checkbox",
        "id": "show_free_shipping_message",
        "default": true,
        "label": "Free shipping"
},
{
        "type": "text",
        "id": "free_shipping_minimum_amount",
        "default": "100",
        "label": "Free shipping minimum amount",
        "info": "Enter amount using number only."
},

Connect Snippet file

{% comment %} free shipping calc {% endcomment %}
{%- liquid
   if settings.show_free_shipping_message and settings.free_shipping_minimum_amount != blank
    assign free_shipping_minimum_amounts = settings.free_shipping_minimum_amount
    render 'free-shipping', minimum_amount: free_shipping_minimum_amounts
   endif
-%}
guest

0 Comments
Inline Feedbacks
View all comments
Scroll to Top