{"id":6542,"date":"2026-10-12T20:36:14","date_gmt":"2026-10-12T09:36:14","guid":{"rendered":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/"},"modified":"2026-10-12T20:36:14","modified_gmt":"2026-10-12T09:36:14","slug":"how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin","status":"publish","type":"post","link":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/","title":{"rendered":"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin"},"content":{"rendered":"<h2>Why Your Shoppers Abandon at the Shipping Step<\/h2>\n<p>Every online store loses shoppers at the same moment: the second they see &#8220;Standard Shipping&#8221; with no arrival date. A delivery ETA widget fixes this by showing each shopper their exact delivery date before they even enter their postcode. No plugin required. No app store subscription. Just a lightweight script that calculates transit times based on your warehouse location and the customer&#8217;s shipping zone.<\/p>\n<p>Here is how to build one from scratch in under an hour.<\/p>\n<h2>What You Need<\/h2>\n<ul>\n<li>Access to your store theme files (or a custom HTML block in your theme editor)<\/li>\n<li>Your warehouse postcode or city<\/li>\n<li>A list of transit times by shipping zone (your carrier provides this for free)<\/li>\n<li>Basic understanding of HTML and JavaScript (copy-paste ready below)<\/li>\n<\/ul>\n<h2>Step 1: Map Your Shipping Zones and Transit Times<\/h2>\n<p>Open a spreadsheet and list every shipping zone you ship to. For each zone, note the minimum and maximum transit time in business days. Your carrier already publishes this data. For example:<\/p>\n<ul>\n<li>Zone 1 (local metro): 1 to 2 business days<\/li>\n<li>Zone 2 (regional): 2 to 3 business days<\/li>\n<li>Zone 3 (interstate): 3 to 5 business days<\/li>\n<li>Zone 4 (remote): 5 to 7 business days<\/li>\n<\/ul>\n<p>You will encode this into a JavaScript object that the widget uses to calculate the arrival date.<\/p>\n<h2>Step 2: Add the Widget Container to Your Product Page<\/h2>\n<p>In your theme editor, open the product page template. Add a container div where you want the ETA to appear. The best placement is directly below the add-to-cart button, before the shipping policy text.<\/p>\n<pre><code>&lt;div id=\"delivery-eta-widget\" style=\"padding: 12px 16px; border: 1px solid #e0e0e0; border-radius: 8px; margin: 12px 0; background: #fafafa;\"&gt;\n  &lt;p id=\"eta-message\" style=\"margin: 0; font-size: 14px; color: #333;\"&gt;\n    Enter your postcode to see your delivery date.\n  &lt;\/p&gt;\n  &lt;input type=\"text\" id=\"eta-postcode\" placeholder=\"Postcode\" style=\"margin: 8px 0; padding: 6px 10px; border: 1px solid #ccc; border-radius: 4px; width: 120px;\"&gt;\n  &lt;button onclick=\"calculateETA()\" style=\"padding: 6px 16px; background: #333; color: #fff; border: none; border-radius: 4px; cursor: pointer;\"&gt;Check&lt;\/button&gt;\n&lt;\/div&gt;<\/code><\/pre>\n<h2>Step 3: Add the JavaScript Logic<\/h2>\n<p>Add this script at the bottom of your product page template, just before the closing body tag or in a custom JavaScript block.<\/p>\n<pre><code>&lt;script&gt;\nconst shippingZones = {\n  \"1000-1999\": { min: 1, max: 2, label: \"Sydney metro\" },\n  \"2000-2999\": { min: 1, max: 2, label: \"Sydney metro\" },\n  \"3000-3999\": { min: 1, max: 2, label: \"Melbourne metro\" },\n  \"4000-4999\": { min: 2, max: 3, label: \"Brisbane metro\" },\n  \"5000-5999\": { min: 3, max: 5, label: \"Adelaide metro\" },\n  \"6000-6999\": { min: 3, max: 5, label: \"Perth metro\" },\n  \"7000-7999\": { min: 3, max: 5, label: \"Hobart metro\" },\n};\n\nfunction calculateETA() {\n  const postcode = document.getElementById(\"eta-postcode\").value.trim();\n  if (!postcode || postcode.length < 4) {\n    document.getElementById(\"eta-message\").innerHTML = \"Please enter a valid postcode.\";\n    return;\n  }\n  const prefix = parseInt(postcode.substring(0, 4));\n  let zone = null;\n  for (const range in shippingZones) {\n    const [min, max] = range.split(\"-\").map(Number);\n    if (prefix >= min && prefix <= max) {\n      zone = shippingZones[range];\n      break;\n    }\n  }\n  if (!zone) {\n    document.getElementById(\"eta-message\").innerHTML = \"Contact us for delivery times to your area.\";\n    return;\n  }\n  const today = new Date();\n  const minDate = addBusinessDays(today, zone.min);\n  const maxDate = addBusinessDays(today, zone.max);\n  const minStr = minDate.toLocaleDateString(\"en-AU\", { weekday: \"short\", day: \"numeric\", month: \"short\" });\n  const maxStr = maxDate.toLocaleDateString(\"en-AU\", { weekday: \"short\", day: \"numeric\", month: \"short\" });\n  document.getElementById(\"eta-message\").innerHTML = \n    \"<strong>Order today<\/strong> for delivery between <strong>\" + minStr + \"<\/strong> and <strong>\" + maxStr + \"<\/strong>.\";\n}\n\nfunction addBusinessDays(date, days) {\n  const result = new Date(date);\n  let added = 0;\n  while (added < days) {\n    result.setDate(result.getDate() + 1);\n    if (result.getDay() !== 0 &#038;&#038; result.getDay() !== 6) {\n      added++;\n    }\n  }\n  return result;\n}\n&lt;\/script&gt;<\/code><\/pre>\n<h2>Step 4: Style It to Match Your Brand<\/h2>\n<p>The widget above uses neutral colours that work on most stores. To match your brand, adjust the border colour, background, button colour, and font size. If your store uses a dark theme, swap the background to a dark tone and the text to white.<\/p>\n<p>A few style tips:<\/p>\n<ul>\n<li>Use your brand accent colour for the button<\/li>\n<li>Keep the border subtle, you want it to feel like helpful information, not a popup<\/li>\n<li>Make the arrival date text bold so it stands out at a glance<\/li>\n<li>Add a small truck or calendar icon if your theme supports it<\/li>\n<\/ul>\n<h2>Step 5: Add a Fallback for Unknown Zones<\/h2>\n<p>Not every postcode will be in your shipping zones object. Add a fallback message that directs shoppers to contact support or check your shipping policy page. This prevents the widget from looking broken for remote or international postcodes.<\/p>\n<pre><code>if (!zone) {\n  document.getElementById(\"eta-message\").innerHTML = \n    \"Delivery times vary for \" + postcode + \". &lt;a href='\/shipping-policy'&gt;Check our shipping policy&lt;\/a&gt; or contact us for an estimate.\";\n  return;\n}<\/code><\/pre>\n<h2>Step 6: Test With Real Postcodes<\/h2>\n<p>Before you publish, test the widget with postcodes from each of your shipping zones. Verify that:<\/p>\n<ul>\n<li>The arrival date skips weekends correctly<\/li>\n<li>The date format reads naturally (e.g. \"Wed 15 Oct\" not \"2026-10-15\")<\/li>\n<li>The widget handles invalid input gracefully<\/li>\n<li>The fallback message appears for postcodes outside your zones<\/li>\n<\/ul>\n<h2>Optional: Auto-Detect Location<\/h2>\n<p>If you want to get fancy, you can use a free geolocation API to pre-fill the shopper's approximate location. This removes the postcode entry step entirely. The shopper sees their delivery date the moment they land on the product page.<\/p>\n<pre><code>\/\/ Optional: auto-detect via browser geolocation\nif (navigator.geolocation) {\n  navigator.geolocation.getCurrentPosition(function(pos) {\n    fetch('https:\/\/api.postcodes.io\/reverse?lon=' + pos.coords.longitude + '&amp;lat=' + pos.coords.latitude)\n      .then(function(r) { return r.json(); })\n      .then(function(data) {\n        if (data.status === 200 &amp;&amp; data.result) {\n          document.getElementById('eta-postcode').value = data.result[0].postcode.split(' ')[0];\n          calculateETA();\n        }\n      });\n  });\n}<\/code><\/pre>\n<p>Note: Always ask for geolocation permission. Some shoppers will decline, and that is fine. The manual postcode entry is the fallback.<\/p>\n<h2>Why This Works Without a Plugin<\/h2>\n<p>The widget is pure HTML, CSS, and JavaScript. It runs entirely in the shopper's browser. No server-side processing, no database queries, no API calls to a third-party service. The only data it needs is your shipping zone map, which you hardcode once and update when your carrier changes transit times.<\/p>\n<p>This means:<\/p>\n<ul>\n<li>Zero impact on page load speed<\/li>\n<li>No monthly subscription fee<\/li>\n<li>No privacy concerns (no customer data leaves the browser)<\/li>\n<li>Full control over the design and messaging<\/li>\n<\/ul>\n<h2>What to Measure After You Add It<\/h2>\n<p>Watch your checkout conversion rate for the week after you add the widget. Most stores see a measurable lift because the number one question shoppers have (\"when will it get here?\") is answered before they have to look for it.<\/p>\n<p>Also watch your \"where is my order\" support tickets. They should drop, because shoppers saw a specific delivery date before they bought, not a vague \"3 to 5 business days\" that they immediately forgot.<\/p>\n<p>Want more like this? Join MOKU Club for free. Weekly resources, early access to new guides, and occasional templates you can actually use. Join below.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Why Your Shoppers Abandon at the Shipping Step Every online store loses shoppers at the same moment: the second they see &#8220;Standard Shipping&#8221; with no arrival date. A delivery ETA&#8230;<\/p>\n","protected":false},"author":8,"featured_media":6539,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[64,59],"tags":[],"class_list":["post-6542","post","type-post","status-publish","format-standard","has-post-thumbnail","category-design","category-how-to"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin &#8212; MOKU Space<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin &#8212; MOKU Space\" \/>\n<meta property=\"og:description\" content=\"Why Your Shoppers Abandon at the Shipping Step Every online store loses shoppers at the same moment: the second they see &#8220;Standard Shipping&#8221; with no arrival date. A delivery ETA...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/\" \/>\n<meta property=\"og:site_name\" content=\"MOKU Space\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/MOKUdigital\/\" \/>\n<meta property=\"article:published_time\" content=\"2026-10-12T09:36:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2024\/02\/mokuspace_og.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"675\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Hera\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Hera\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/\"},\"author\":{\"name\":\"Hera\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/#\\\/schema\\\/person\\\/fcc0cf0192c88b70fc3156df50cbde7d\"},\"headline\":\"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin\",\"datePublished\":\"2026-10-12T09:36:14+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/\"},\"wordCount\":754,\"publisher\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/hero-howto-delivery-eta-widget-1.png\",\"articleSection\":[\"Design\",\"How-to\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/\",\"url\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/\",\"name\":\"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin &#8212; MOKU Space\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/hero-howto-delivery-eta-widget-1.png\",\"datePublished\":\"2026-10-12T09:36:14+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/#primaryimage\",\"url\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/hero-howto-delivery-eta-widget-1.png\",\"contentUrl\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/hero-howto-delivery-eta-widget-1.png\",\"width\":1024,\"height\":1536},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/#website\",\"url\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/\",\"name\":\"MOKU Space\",\"description\":\"A space to learn and find resources for growth in the digital landscape.\",\"publisher\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/#organization\",\"name\":\"MOKU Digital\",\"alternateName\":\"MOKU\",\"url\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/wp-content\\\/uploads\\\/2024\\\/01\\\/MOKU_SPACE_ICON_2x.png\",\"contentUrl\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/wp-content\\\/uploads\\\/2024\\\/01\\\/MOKU_SPACE_ICON_2x.png\",\"width\":580,\"height\":579,\"caption\":\"MOKU Digital\"},\"image\":{\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/MOKUdigital\\\/\",\"https:\\\/\\\/www.instagram.com\\\/mokudigital\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/#\\\/schema\\\/person\\\/fcc0cf0192c88b70fc3156df50cbde7d\",\"name\":\"Hera\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/cropped-hera_pfp-bw_v2-96x96.jpg\",\"url\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/cropped-hera_pfp-bw_v2-96x96.jpg\",\"contentUrl\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/cropped-hera_pfp-bw_v2-96x96.jpg\",\"caption\":\"Hera\"},\"url\":\"https:\\\/\\\/mokudigital.com\\\/space\\\/author\\\/hera\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin &#8212; MOKU Space","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/","og_locale":"en_US","og_type":"article","og_title":"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin &#8212; MOKU Space","og_description":"Why Your Shoppers Abandon at the Shipping Step Every online store loses shoppers at the same moment: the second they see &#8220;Standard Shipping&#8221; with no arrival date. A delivery ETA...","og_url":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/","og_site_name":"MOKU Space","article_publisher":"https:\/\/www.facebook.com\/MOKUdigital\/","article_published_time":"2026-10-12T09:36:14+00:00","og_image":[{"width":1200,"height":675,"url":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2024\/02\/mokuspace_og.jpg","type":"image\/jpeg"}],"author":"Hera","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Hera","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/#article","isPartOf":{"@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/"},"author":{"name":"Hera","@id":"https:\/\/mokudigital.com\/space\/#\/schema\/person\/fcc0cf0192c88b70fc3156df50cbde7d"},"headline":"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin","datePublished":"2026-10-12T09:36:14+00:00","mainEntityOfPage":{"@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/"},"wordCount":754,"publisher":{"@id":"https:\/\/mokudigital.com\/space\/#organization"},"image":{"@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/#primaryimage"},"thumbnailUrl":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2026\/10\/hero-howto-delivery-eta-widget-1.png","articleSection":["Design","How-to"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/","url":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/","name":"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin &#8212; MOKU Space","isPartOf":{"@id":"https:\/\/mokudigital.com\/space\/#website"},"primaryImageOfPage":{"@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/#primaryimage"},"image":{"@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/#primaryimage"},"thumbnailUrl":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2026\/10\/hero-howto-delivery-eta-widget-1.png","datePublished":"2026-10-12T09:36:14+00:00","breadcrumb":{"@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/#primaryimage","url":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2026\/10\/hero-howto-delivery-eta-widget-1.png","contentUrl":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2026\/10\/hero-howto-delivery-eta-widget-1.png","width":1024,"height":1536},{"@type":"BreadcrumbList","@id":"https:\/\/mokudigital.com\/space\/how-to-build-a-delivery-eta-widget-that-shows-each-shopper-their-exact-arrival-date-without-a-plugin\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/mokudigital.com\/space\/"},{"@type":"ListItem","position":2,"name":"How to Build a Delivery ETA Widget That Shows Each Shopper Their Exact Arrival Date Without a Plugin"}]},{"@type":"WebSite","@id":"https:\/\/mokudigital.com\/space\/#website","url":"https:\/\/mokudigital.com\/space\/","name":"MOKU Space","description":"A space to learn and find resources for growth in the digital landscape.","publisher":{"@id":"https:\/\/mokudigital.com\/space\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/mokudigital.com\/space\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/mokudigital.com\/space\/#organization","name":"MOKU Digital","alternateName":"MOKU","url":"https:\/\/mokudigital.com\/space\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/mokudigital.com\/space\/#\/schema\/logo\/image\/","url":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2024\/01\/MOKU_SPACE_ICON_2x.png","contentUrl":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2024\/01\/MOKU_SPACE_ICON_2x.png","width":580,"height":579,"caption":"MOKU Digital"},"image":{"@id":"https:\/\/mokudigital.com\/space\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/MOKUdigital\/","https:\/\/www.instagram.com\/mokudigital"]},{"@type":"Person","@id":"https:\/\/mokudigital.com\/space\/#\/schema\/person\/fcc0cf0192c88b70fc3156df50cbde7d","name":"Hera","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2026\/04\/cropped-hera_pfp-bw_v2-96x96.jpg","url":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2026\/04\/cropped-hera_pfp-bw_v2-96x96.jpg","contentUrl":"https:\/\/mokudigital.com\/space\/wp-content\/uploads\/2026\/04\/cropped-hera_pfp-bw_v2-96x96.jpg","caption":"Hera"},"url":"https:\/\/mokudigital.com\/space\/author\/hera\/"}]}},"_links":{"self":[{"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/posts\/6542","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/comments?post=6542"}],"version-history":[{"count":0,"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/posts\/6542\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/media\/6539"}],"wp:attachment":[{"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/media?parent=6542"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/categories?post=6542"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mokudigital.com\/space\/wp-json\/wp\/v2\/tags?post=6542"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}