You can add many fields in the billing and shipping form by following snippets but what if we want to add fields outside it on the checkout form so to do that follow this code. In the below image check the default fields provided.
Now let’s add the field to the form. Add the following to the function.php in your child theme.
/**
* Add delivery date picker on the Checkout page, after order note
*/
function wps_delivery_date_picker_checkout_field( $checkout ) {
echo '<div id="delivery_date_checkout_field">';
woocommerce_form_field( 'order_delivery_date', array(
'type' => 'text',
'class' => array('delivery-date-class form-row-wide'),
'label' => __('Delivery Date'),
'placeholder' => __('04/26/2020'),
), $checkout->get_value( 'order_delivery_date' ));
echo '</div>';
}
add_action('woocommerce_after_order_notes', 'wps_delivery_date_picker_checkout_field' );
/**
* Update the order meta with a field value
*/
function wps_save_delivery_date_to_order_detail( $order_id ) {
if ( ! empty( $_POST['order_delivery_date'] ) ) {
update_post_meta( $order_id, 'order_delivery_date', sanitize_text_field(
$_POST['order_delivery_date'] ) );
}
}
add_action( 'woocommerce_checkout_update_order_meta', 'wps_save_delivery_date_to_order_detail' );
/**
* Show custom field value in the order detail
*/
function wps_show_delivery_date_in_order_detail($order){
echo '<p><strong>'.__('Delivery Date').':</strong> ' . get_post_meta(
$order->id, 'order_delivery_date', true ) . '</p>';
}
add_action( 'woocommerce_admin_order_data_after_billing_address', 'wps_show_delivery_date_in_order_detail', 10, 1 );
