EDD Widget Customization 

  • 10/12/2024
  • 527
  • 0

In this post, you will learn how to customize your Estimated Delivery Date Widget to match your Product page’s Look and feel. Let’s get started!

How to customize your EDD Widget?

To customize your widget, you first need to navigate to the Widget settings:

widget settings_configuration

There will be 6 sections in the Widget settings:

  • Text settings
  • Visual
  • Padding
  • Date format
  • Timezone setting
  • Out-of-stock message

Each customization will appear as pictured right next to the settings part. Let’s take a look through each!

Text settings

Enter your delivery date message, you can add these variables: 

  • Add Flag: User’s country flag icon
  • Add Country: User’s country name 
  • Ready Date Min: The minimum preparation date before ready to ship
  • Ready Date Max: The maximum preparation date before ready to ship 
  • Delivery Date Min: The earliest possible delivery date
  • Delivery Date Max: The latest possible delivery date
  • Add cut-off time: The daily cut-off time for orders to be processed the same day
text_settings

Below is a Text sample and how it looks on the Widget preview:

Text sample: 

Free Shipping to  {country_name}{country_flag}.
Your order will be ready between {order_ready_minimum_date} and {order_ready_maximum_date} and you’ll receive your package between {order_delivered_minimum_date} and {order_delivered_maximum_date}
preview_widget

Visual

Simply decide how your Order Delivery Progress looks by configuring these fields:

  • Display type (Choose how the date widget shows up on your site)
    • Progress bar and message
    • Progress bar only
    • Message only 
  • Date type: Choose the date format for the estimated delivery date under the progress bar 
visual_settings

Note: Choose to enable/disable the Status icon by simply switching the toggle Show icon

Padding

Adjust the metrics to change the position of the delivery message:
(The numbers are in px)

edd_padding

The illustration widget appears on the right side to check your updates 

Date format

You can choose your preferred date format for the Text Message here, which makes it easier for customers to understand the times they use most frequently.

edd_date format
edd_date format_language

Note: Choose the language used to display your estimated delivery date

Timezone Setting

Users have the option to either automatically match the timezone to each visitor’s IP by selecting Automatic Timezone Conversion or manually select a specific timezone from the list below.

timezone setting

Out-of-stock messages

This section allows you to write a text message informing customers when a product is out of stock.

out_of_stock__message

This message will only appear for the sold-out items and can be simply disabled at any time by switching the active toggle.

Below is an example of how the EDD Widget looks after customizing:

edd_delivery date widget

Need any help? 

If you need any assistance with NS Product Variants, feel free to contact us via live chat in-app or email [email protected]. Our support team is happy to help!

Helpful?

Featured articles

Delivery Country

The Delivery Country feature allows you to set specific delivery dates for each destination country. NS Estimated Delivery Date automatically

Priority Of Rule Levels

NS Estimated Delivery Date organizes delivery date estimates by three levels of rules: Global Rule, Collection Rule, and Product Rule. 

Can’t Find What You Need? 🤔


Article Outline