Add Estimated Delivery Date For Shopify Via Custom Code

Add Estimated Delivery Date For Shopify Via Custom Code

How to Add Estimated Delivery Dates in Shopify (3 Simple Methods)

Introduction

Adding estimated delivery dates to your Shopify product pages or cart is a powerful way to build customer trust and increase conversions. While Shopify does not offer this feature by default, you can easily implement it using custom code. In this guide, you’ll learn three effective methods to display estimated delivery dates on your Shopify store.

 

Why Show Estimated Delivery Dates?

Including delivery estimates on your store helps in multiple ways:

 

Methods for Adding Estimated Delivery Dates

There are 3 possible ways of how you can add an estimated delivery date in Shopify.

  1. Show static Estimated delivery date range
  2. Show dynamic delivery date based on the Today’s date
  3. Dynamic Delivery By Product or Location Using Metafields

Method 1: Show Static Estimated Delivery Date Range

In this method you can set the static delivery date based on your business shipping details, usually (Delivery in 3-5 business days). Estimated delivery date in the store can help to improve the user user experience and trust. Here is the final result, check the GIF below to see how it will look before we go through the steps.

Add Estimated Delivery Date For Shopify Via Custom Code

Step 1: Navigate to Online store > Themes > Edit code

Add Estimated Delivery Date For Shopify Via Custom Code
Add Estimated Delivery Date For Shopify Via Custom Code

Step 2: Navigate to the product.liquid or main-product.liquid file (can be changed from theme to theme) and open it.

Add Estimated Delivery Date For Shopify Via Custom Code

Step 3: Paste the following code in the desired location usually below the add to cart button and save the changes.

Estimated Delivery: 3–5 business days  

Pros: 

  • It is a simple and fast approach.
  • No need to calculate the actual dates.

Cons: 

  • It is not personalized 
  • It doesn’t add weekends or holidays.

 

Method 2: Show dynamic delivery date based on the Today’s date 

In this method you can show a dynamic delivery date range based on today's date like "Estimated delivery between July 26 and July 29". Hard coded dates needs updates on regular basis while dynamic dates can be changed once. It automatically updates based on the current date.

Step 1: Navigate to Online Store > Themes > Edit code

Add Estimated Delivery Date For Shopify Via Custom Code

Step 2: Go to the main-product.liquid file.

Add Estimated Delivery Date For Shopify Via Custom Code

Step3: Paste thi s code inside product.liquid or main-product.liquid file inside the script tag.

    
    <p id="estimated-delivery"></p>
    <script>
        const today = new Date();
        const minDays = 3;
        const maxDays = 6;
        
        const options = { month: 'long', day: 'numeric' };
        
        const startDate = new Date(today);
        startDate.setDate(today.getDate() + minDays);
        const endDate = new Date(today);
        endDate.setDate(today.getDate() + maxDays);
        
        const formattedStart = startDate.toLocaleDateString('en-US', options);
        const formattedEnd = endDate.toLocaleDateString('en-US', options);
        
        document.getElementById('estimated-delivery').innerText = 
            `Estimated delivery between ${formattedStart} and ${formattedEnd}`;
    </script>

    

Pros: 

  • It automatically updates on a daily basis and doesn't have to update manually.
  • It is a professional way of doing things.

Cons:

  • It does not skip weekends and holidays.
  • Must need customizations for local zones.

 

Method 3: Dynamic Delivery by Product or Location Using Metafields

In this method if you have different delivery time per product or region than this method can give you full control. In this method you can set the different delivery date based on the country and region and set the different date for each product separately. Follow these steps to add delivery date using the Metafields.

Step 1: Add Metafield to your product.

Step 2: Navigate to the Shopify Admin and click Settings.

Add Estimated Delivery Date For Shopify Via Custom Code

Step 3: Navigate to the Metafields and Metaobjects section

Add Estimated Delivery Date For Shopify Via Custom Code

Step 4: Select Products and then click Add definition Button

Add Estimated Delivery Date For Shopify Via Custom Code
Add Estimated Delivery Date For Shopify Via Custom Code

Step 5: Name it something like Estimated Delivery and select the type to Single line Text

Add Estimated Delivery Date For Shopify Via Custom Code
Add Estimated Delivery Date For Shopify Via Custom Code

Step 6: Navigate to the Product section and select the product where you want to add Metafield value and click on it.

Add Estimated Delivery Date For Shopify Via Custom Code

Step 7: Go to the Metafiled section and add something like this. 

Add Estimated Delivery Date For Shopify Via Custom Code

Step 8: Navigate to the main-product.liquid file and add following code to the file.

  
  
    {% if product.metafields.custom.estimated_delivery %}
    <p class="estimated-delivery">
      {{ product.metafields.custom.estimated_delivery }}
    </p>
    {% endif %}
  

For more on boosting conversions, see our in-depth guide: Why SEO is Important for E-commerce | Boost Visibility and our Shopify conversion rate optimization tips.  

 

Bottom Line 

Displaying estimated delivery dates can significantly enhance the shopping experience and build trust with your customers. Whether you choose a static message, dynamic script, or product-specific metafields, each method offers its own level of customization and complexity. If you want more tips on enhancing your Shopify store’s features, visit Shopify’s official help center or explore our Shopify development services for tailored solutions.

Choose the method that best fits your business needs and technical comfort. A small tweak like this can make a big impact on your Shopify store’s performance!

Need help implementing this on your store? If you'd like expert assistance or something in this blog isn't working as expected, feel free to reach out to Ecomx Agency, we're here to help you get it fixed fast and right!

Frequently Asked Questions

No, Shopify does not display estimated delivery dates by default. You’ll need to implement it manually using custom code or apps.

The easiest method is using a static message like “Delivery in 3–5 business days.” It’s quick and doesn’t require any advanced setup.

Yes, with a simple JavaScript snippet, you can display a date range like “Estimated delivery between Aug 10–Aug 13” that updates daily.

Use Shopify Metafields to assign custom delivery messages per product. This is ideal if you have different shipping durations for various items.

No, the basic version does not skip weekends or holidays. You would need to modify the code or use an advanced app for that.

Not necessarily. If you’re comfortable editing your theme code, you can follow the guide yourself. Otherwise, a developer or Shopify expert can help.

You can show it on the cart page, but modifying the checkout page is only possible if you’re on Shopify Plus.

Comments(0)
You don't have any comments yet

Are You Looking for a Shopify Expert?

We design, develop, optimize, and scale high-converting Shopify stores.

Get in touch
Let's Connect
Shopify Plus eCommerce Development Agency ecomx agency

Looking for a Trusted Ecommerce & Shopify Plus Agency?

We design, develop, optimize, and scale high converting Shopify Ecommerce stores that drive sales.

Get in Touch
Adam

Need a hand with your e-commerce? Shopify Migration Experts Agency Ecomx shopify plus agency

Let’s talk about your next project

Shopify Custom Theme Development Services Live Chat