How to Show Estimated Delivery Date in Shopify?

0 comments

Show Estimated Delivery Date on your Shopify store

Table Of Contents

Do you know that displaying the estimated delivery date on your Shopify store may improve the customer experience? This guide will help you clearly show expected delivery dates (EDDs) on your Shopify site, with and without code.

Why Should You Display Estimated Delivery Dates (EDDs) On Your Shopify Store?

Did you know that 41% of online stores still rely solely on shipping speeds? While speed is essential, it only tells part of the story for your customers. The real question they're asking is: when will my order arrive?

Getting rid of shipping speeds and showing clear EDDs will improve your customers' experience. Let's see the benefits of it:

  • Build trust and confidence: Putting EDDs on display shows openness and builds consumer confidence. Knowing what to expect reduces anxiety about when their orders will arrive.
  • Reduce customer inquiries: EDDs may dramatically cut resource burdens. Customers may get the necessary information without contacting you by showing expected arrival dates.
  • Boost conversions: Knowing when their order will arrive reduces reluctance and increases conversions and purchases.

So, why wait? In the next part, you will learn how to display estimated delivery dates on your Shopify store.

Show Estimated Delivery Date On Shopify With Coding

This method only works with Shopify OS 2.0 themes and needs basic code knowledge.

Don't worry if you don't know the code. Scroll down the following section; we will guide you through the Shopify estimated delivery date using the third app.

Here is a step-by-step guide displaying the estimated delivery date on Shopify:

Step 1: Navigate To Theme Customization

You can begin by logging into your Shopify admin panel and click "Online Store" > "Themes" > "Customize."

Show Estimated Delivery Date on Shopify with coding

Step 2: Create A New Product Template

We suggest making a new product template so that you don't change the style of your original product page. This lets you change the new page without changing how the old page looks.

To do this, in the middle menu of Shopify's theme customizer, select "Products" > "Create template".

Show Estimated Delivery Date on Shopify with coding

Step 3: Add Custom Liquid Code

After step 2, go to the "Add Section" and then select "Custom Liquid."

Show Estimated Delivery Date on Shopify with coding

This is where you'll insert the given code snippet to show the approximate delivery date:

<p> <img src="https://cdn-icons-png.flaticon.com/512/709/709790.png" style="height:25px;float:left;margin-right:10px;padding-bottom: 4px;"/>

Get it between <strong><span id="fromDate"></span> - <span id="toDate"></span></strong></p>

{{ '//cdnjs.cloudflare.com/ajax/libs/datejs/1.0/date.min.js' | script_tag }}

<script>

var fromDate = Date.today().addDays(5);

if (fromDate.is().saturday() || fromDate.is().sunday()) {

fromDate = fromDate.next().monday();

}

var toDate = Date.today().addDays(10);

if (toDate.is().saturday() || toDate.is().sunday()) {

toDate = toDate.next().monday();

}

document.getElementById('fromDate').innerHTML = fromDate.toString('dddd MMMM dS');

document.getElementById('toDate').innerHTML = toDate.toString('dddd MMMM dS');

</script>

Code breakdown:

  • By default, the code estimates delivery within 5-10 business days after buying. You may vary this range by changing the code's "5" and "10" values.
  • The script_tag helper function integrates date.min.js for dynamic date computations.
  • The script estimates delivery dates by adding a 5-day buffer to the current date (excluding weekends) and then a 10-day buffer. Finally, it formats these dates conveniently ("Friday, June 14th"- "Monday, June 24th").
Show Estimated Delivery Date on Shopify with coding

Finally, click "Preview" to preview the changes and "Save" them when satisfied.

For maximum effect, we suggest placing your block underneath the "Buy It Now" button. This clever positioning gives customers a clear checkout view.

Show Estimated Delivery Date on Shopify with coding

Show Estimated Delivery Date in Shopify Without Coding

EComposer Page Builder's straightforward drag-and-drop editor allows you to adjust Shopify's expected delivery date with its features:

  • Visual editing: Drag and drop to add or change your delivery date section.
  • Real-time preview: See your changes instantly as you make them with the live preview feature.
  • Icon library: Choose from various icons to visually represent estimated delivery times.
  • Template selection: Start your design with templates with data on expected delivery.

Here is how to use EComposer to show and edit your Shopify estimated delivery date:

Step 1: Install EComposer Builder Page

Visit the Shopify App Store and search for "EComposer Landing Builder Page"-or just click the button down below to get straight to it. 

Once installed, launch EComposer from Shopify Admin and select "Start building" > "Product page" to edit the estimated delivery date on your product page.

Use EComposer to edit Shopiy delivery time

Step 2: Edit Your Shopify Estimated Delivery Date

Find "Delivery Time" on the left side of the "Elements" tab in the EComposer editor.

Then, drag and drop the "Delivery Time" element to the correct position on the product page.

Use EComposer to edit Shopiy delivery time

Now, in the "Delivery text" area, type something like: "Order in the next [hour] to get it between [date_start] and [date_end]."

You can easily change "Exclude days," "Delivery cut off (UTC Time)," "Text hour(s)," and "Text minute(s)" by typing it.

Use EComposer to edit Shopiy delivery time

Additionally, EComposer lets you change the months and days to any language you want.

Step 3: Save Your Change

Before publishing your updates, preview your storefront to ensure everything looks perfect.

EComposer allows you to publish up to 3 pages during the free trial. You can upload to a paid plan to unlock more features and upload pages.

For example, we will show "Delivery Time" below the "Add to Cart" button for a clear and prominent display.

Use EComposer to edit Shopiy delivery time

Want even more options for managing delivery dates on Shopify? Read the next part to find out!

Top 3 Shopify Delivery Date Apps

While the EComposer Builder Page provides an easy method for entering and changing expected delivery dates, various Shopify applications focus on delivery date management and let customers choose their delivery time.

Here are five recommended Shopify delivery date apps:

#1. Pickup Delivery Date -Pickeasy

Rating: 4.9/5.0 ⭐ (942+).

Pickup Delivery Date —Pickeasy on Shopify App Store

Pickup Delivery Date -Pickeasy on Shopify App Store.

Pickeasy fits companies with a variety of delivery needs. The thing that makes Pickeasy unique is:

  • Flexible Fulfillment: You may choose in-store pickup, local delivery, or standard shipping.
  • Order Deadline Control: Set order deadlines by pickup or delivery date (e.g., Friday pickup orders by Thursday 4 PM).
  • Blackout Dates: Limit orders on holidays to minimize staff overload.
  • Granular Delivery Rates: Define an accurate delivery price based on zip code, product weight, cart value, and the time window to recover delivery expenses.
  • Product-Specific Rules: You may limit pickup and delivery to specified days or delivery zones.
  • Multi-location Management.

Pricing: A free trial with 20 orders/month and a $9.99/month starter fee.

Pickeasy’s app pricing.

Pickeasy's pricing.

#2. Stellar Delivery Date & Pickup

Rating: 4.9/5.0 ⭐ (736+)

Stellar Delivery Date & Pickup on Shopify App Store

Stellar Delivery Date & Pickup on Shopify App Store.

With Stellar Delivery Date & Pickup, customers can easily manage their orders, and your business can run more efficiently in the background. How Stellar shines:

  • Estimated Delivery Visibility: Show expected delivery timelines on product pages for client transparency.
  • Rescheduling Power: Allow customers to quickly reschedule purchases from the thank-you page, reducing delivery problems.
  • Day-Wise Shipping Rates: Flexible pricing strategies are possible with dynamic shipping prices dependent on delivery date.

The Stellar Delivery Date app is an excellent option for businesses with a single location.

Pricing: A limited-order free trial with limitless locations is available, and from a $14.99/month for store pickup version.

Stellar Delivery Date's pricing

Stellar Delivery Date's pricing.

#3. Estimated Delivery Date ‑ Plus

Rating: 4.8/5.0 ⭐ (637+)

Estimated Delivery Date ‑ Plus on Shopify App Store

Estimated Delivery Date ‑ Plus on Shopify App Store.

Estimated Delivery Date ‑ Plus (Plus) takes a different approach compared to Stellar Delivery Date & Pickup (Stellar) and Pickup Delivery Date - Pickeasy (Pickeasy). Here's how it stacks up:

  • Focus on Estimated Dates: Plus emphasizes providing anticipated delivery dates on product pages, carts, and checkout for straightforward consumer communication.
  • Multilingual Support: Show expected delivery texts in multiple languages to reach people worldwide.
  • Time Zone Flexibility: You can ensure the delivery estimate is correct by using either the visitor's or the store's default time zone.

Estimated Delivery Date Plus greatly improves consumer transparency by providing clear estimated delivery information across your shop.

Pricing: A free trial and the most basic plans start at $4.98/month.

Estimated Delivery Date ‑ Plus’s pricing

Estimated Delivery Date ‑ Plus's pricing.

Tips For Displaying Estimated Delivery Dates

Now you know how to display estimated delivery dates for your Shopify store. Let's discuss practical tips for displaying them effectively in this part.

Choose Where To Display Estimated Delivery Dates

Here are two recommended options you can display the expected arrival dates (EDDs) on Shopify:

Product page:

Based on the Project44 survey, most customers (75.1%) said adding estimated delivery dates to the product page improves their decision-making. This makes perfect sense, as buying decisions are often cemented on product pages.

By displaying precise estimated arrival times right there (Look at "below the 'Start Designing' button" like Rush Order Tees in the image below), you eliminate the need for customers to hunt for this information elsewhere.

Rush Order Tees' product page

Rush Order Tees' product page.

You can also add your Shopify shipping policy to the product page for a one-stop shipping store. Transparency improves consumer trust and simplifies purchases, increasing sales and customer satisfaction.

Read more: 11 Excellent Shopify Store Policy Page Templates.

Cart page:

The energy grows as people put more things in their carts. Don't let worries about giving birth slow them down. For example, The North Face could improve its checkout process and make the expected arrival date stand out on the cart page.

The North Face's cart page

The North Face's cart page.

This makes them more likely to buy and removes any last-minute worries about when their goodies will come.

We recommend you strive to present clear, concise, and consistent estimated delivery dates across all these touchpoints (product page, cart, checkout) for a seamless customer experience.

Account For Holidays And Potential Delays

Celebrations like birthdays, anniversaries, and holidays sometimes need online orders with a specific delivery date in mind.

Consider using cutting-edge tools such as Shipup SDE (Smart Delivery Estimate). These tools use Google's AI algorithms to guess when packages will arrive more accurately. They also use real-time data like weather, traffic trends, and transport capacity to ensure they take into account delivery times during busy times.

Shipup SDE’s website

Shipup SDE's website.

Also, applications such as Pickup Delivery Date-Pickeasy (before presented) should be used to restrict orders to specified days. This helps you keep control and focus on order accuracy during busy times.

Set Delivery Date Locations

Now, we all know that EDDs can influence customer buying decisions. But don't forget that location matters.

Here's the good news: all the Shopify delivery date apps listed before enabling you to experiment with positioning. You may locate the sweet spot where your audience will respond most.

Think about how REI handled things for inspiration. They use a sidebar zip code box to provide fast delivery estimates depending on consumer location. Customer access to EDDs is quick and straightforward, while the product page remains clutter-free.

REI's product page

REI's product page.

Key Takeaways

Estimated delivery dates (EDDs) are a great way to provide your Shopify shop with the transparency your consumers want. Customers can make intelligent choices about what to buy because they know exactly when their new gifts will arrive. This makes purchasing more accessible and reduces worry while increasing trust and enjoyment.

For a more straightforward solution, the EComposer Builder Page lets you display EDDs without any coding required. This is an excellent choice if you just want the basic functionality.

To make your Shopify shop stand out, visit our blog for additional valuable hints.

May_2024_EC_Facebook_group_invite-_Blog_footer_1cff0281-7bbe-4adf-a48b-b927509b0f36