1. Home
  2. Order Delivery Date Pro For WooCommerce
  3. Appearance
  4. Fields Placement on Checkout Page

Fields Placement on Checkout Page

In our last post, we discussed how you can make your field labels flexible on the checkout page. In this post, we will discuss on how you can change the position of Delivery Date & Time fields on the checkout page.

Generally, there are queries from our customers like How they can shift the fields in shipping section on the checkout page? or How they can set Delivery date & Time fields before or after order note?

The plugin allows you to change the position of the Delivery Date & Time fields on the checkout. You can place the fields in billing address section, shipping address section, before order notes or after order notes on the checkout page.

You can setup this under Order Delivery Date -> General Settings -> Appearance -> Field Appearance.

Set Delivery Date & Time fields placement - General Settings
General Settings

Along with the field labels, you can find field placement setting on the checkout page in Field Appearance section.

Set Delivery Date & Time fields placement - Field Appearance
Field Appearance

Billing Section: Admin setting

The default option selected is billing section. So the fields will be added in the billing address section on the checkout page. You can select the radio buttons for the options where you want to place your fields.

Set Delivery Date & Time fields placement - Billing Section Admin Setting
Billing Section – Admin Setting

Billing Section: Checkout Page

If you have selected billing section option, the fields will be added at the bottom of the billing address form on the checkout page.

Set Delivery Date & Time fields placement - Billing Section Checkout Page
Billing Section – Checkout Page

Shipping Section: Admin Setting

The second option is to place the fields in the shipping address section. Some of our clients want that the delivery fields should be in the shipping address section instead of the billing. As there is a possibility that the delivery address of the order is different from the billing address of the customer.

Set Delivery Date & Time fields placement - Shipping Section Admin Setting
Shipping Section – Admin Setting

Shipping Section: Checkout page

If you have selected shipping section option, the fields will be added at the bottom of the shipping address form on the checkout page. If the shipping option is disabled under WooCommerce -> Settings, then the Delivery Date & Time fields will not be displayed if the shipping option is selected.

Set Delivery Date & Time fields placement - Shipping Section Checkout Page
Shipping Section – Checkout Page

Before Order Notes: Admin setting

Another option to add the fields is before the order notes section of the checkout page. Some of the clients using the plugin only deliver the products on the billing address. They do not allow customers to add the different address for delivery. Such customers want that the delivery fields should be displayed in the place of shipping address. So you can select the Before Order Notes option.

 Set Delivery Date & Time fields placement - Before Order Notes Admin Setting
Before Order Notes – Admin Setting

Before Order Notes: Checkout page

The fields will be added before the order notes section on the checkout page.

Set Delivery Date & Time fields placement - Before Order Note Checkout Page
Before Order Notes – Checkout Page

After Order Notes: Admin Setting

Last option is After Order notes section on the checkout page. You can select this option if you want to place the Delivery Date & Time fields after the Order Notes on the checkout page.

Set Delivery Date & Time fields placement - After Order Notes Admin Setting
After Order Notes – Admin Setting

After Order Notes: Checkout page

If you select after order notes option then the fields will be added before the order notes section on the checkout page.

Set Delivery Date & Time fields placement - After Order Notes Checkout Page
After Order Notes – Checkout Page

Conclusion

You can add the Delivery Date & Time fields as per your store requirements using this option on the checkout page. This will take around 5 to 7 minutes.

There are some more features in this plugin. We will be discussing them in our future posts.

Was this article helpful to you? Yes 1 No

How can we help?