Get ready with DingDoong: How to add date picker widget on your Shopify store

Do you know? Businesses using delivery date pickers report a 15–20% reduction in cart abandonment, as customers no longer face the friction of uncertain delivery timelines ☹️


Just a few minutes started with DingDoong can solve this problem and save you thousands of dollars and hours spent confirming delivery dates repeatedly with your customers. By providing an interactive calendar, your customers can easily choose their preferred delivery or pickup date and time.

What to Expect from DingDoong

Widget Position: Place the date picker on the Product page, Cart page/Cart drawer, or both.
Widget Styling: Customize DingDoong to perfectly match your brand’s look and feel.
Flexible Scheduling: Whether you have multiple locations or just one, manage different delivery methods like store pickup, local delivery, and shipping with ease.

Let's get started by following these steps

Important: Please remember that the widget will show up if you embed app and set up at least 1 scheduling rule. If the widget doesn't appear, please contact us for help.

Step 1. Embed app in your theme

For Shopify beginners, embedding the app means integrating DingDoong directly into your Shopify admin dashboard. This allows you to use all app features seamlessly without leaving Shopify.

Choose the theme where you want to embed the widget.
If you prefer not to publish the app live immediately, you can try embedding it in a test theme. (Learn how to create a test theme.)

Step 2. Choose Widget Position

By default, widget will appear on Cart page/ Cart drawer (the most recommended position )

You can choose whether you want to show widget on Product page or Cart page/Cart drawer
If you want widget to appear on both page, please contact us
If you don't know which position is suitable for you. Read more



Troubleshooting: Normally, our app will add the date picker automatically when you selected the position. However, if it doesn't work, please go to Place the widget manually. We usually work with Shopify default theme, but if you customized your theme, please add widget manually

Step 3. Configure Your Store’s Location and Scheduling

Enable the delivery methods you want to offer: Store pickup, Local delivery, or Shipping.

Set up scheduling rules:

Configure date and time options.
Define prep time to control which delivery slots your customers can select.
Set blackout dates to block unavailable days.
Optionally, manage product-specific scheduling rules.

Step 4. Set Up Delivery and Pickup Rates

Currently, DingDoong does not support rate setup within the app. Use Shopify’s built-in rate settings instead.

You can configure rates based on:
Product weight
Minimum order value
Zip/Postal codes
Maximum delivery radius
Learn more about how to set up rates on the checkout page.

Step 5. Configure email notifications

Keep your customers informed about their delivery or pickup details.
Set up order confirmation emails to display the selected date and time.
Enable customer notifications for statuses like “Ready for pickup” or “Out for delivery.”

By following these steps, you can quickly add a professional, user-friendly date picker widget to your Shopify store with DingDoong, reducing cart abandonment and enhancing customer satisfaction.

Updated on: 30/05/2025