Add Extra Checkout Fields Woocommerce

Let\’s suppose you want your customer to add their nickname as well on checkout form for better shipping expeience .

You can do so without any plugin or prior coding knowledge. All you need to do is to paste the below code in your theme\’s functions.php file and its done.

** You can either add this code directly to your functions.php file or you can use code-snippet plugin and add the below code in that snippet.

PHP snippet 1 of 3 : Add new field @woocommerce checkout

We will display the new field Nichkname on the WooCommerce Checkout page, and specifically above the “Order Notes”, which usually display in the shipping column.

/**
 * @snippet       Add Custom Field @ WooCommerce Checkout Page
  * @author        miqtiquedesigns
  * @testedwith    WooCommerce 5.8
 */
  
add_action( \'woocommerce_before_order_notes\', \'md_add_custom_checkout_field\' );
  
function bbloomer_add_custom_checkout_field( $checkout ) { 
   $current_user = wp_get_current_user();
   $saved_license_no = $current_user->nick_name;
   woocommerce_form_field( \'nick_name\', array(        
      \'type\' => \'text\',        
      \'class\' => array( \'form-row-wide\' ),        
      \'label\' => \'Nick Name\',        
      \'placeholder\' => \'kumar\',        
      \'required\' => true,        
      \'default\' => $saved_nick_name,        
   ), $checkout->get_value( \'nick_name\' ) ); 
}

PHP snippet 2 of 3 : Validate new checkout field

Since we already made this field required by doing required=>true , we want user to see some message if they leave this field empty.

/**
 * @snippet       Add Custom Field @ WooCommerce Checkout Page
  * @author        miqtiquedesigns
  * @testedwith    WooCommerce 5.8
 */


add_action( \'woocommerce_checkout_process\', \'md_validate_new_checkout_field\' );
  
function md_validate_new_checkout_field() {    
   if ( ! $_POST[\'nick_name\'] ) {
      wc_add_notice( \'Please enter your Nick Name\', \'error\' );
   }
}

PHP snippet 3 of 3 : Save & show new field @woocommerce orders & email

Now if the validation id passed , woocommerce will process the order but we didn\’t saved the nick name yet so its value will be lost. We will have to add a function to save and show this field\’s value inside order details and order email.

/**
 * @snippet       Add Custom Field @ WooCommerce Checkout Page
  * @author        miqtiquedesigns
  * @testedwith    WooCommerce 5.8
 */
add_action( \'woocommerce_checkout_update_order_meta\', \'md_save_new_checkout_field\' );
  
function bbloomer_save_new_checkout_field( $order_id ) { 
    if ( $_POST[\'license_no\'] ) update_post_meta( $order_id, \'_nick_name\', esc_attr( $_POST[\'nick_name\'] ) );
}
  
add_action( \'woocommerce_admin_order_data_after_billing_address\', \'md_show_new_checkout_field_order\', 10, 1 );
   
function bbloomer_show_new_checkout_field_order( $order ) {    
   $order_id = $order->get_id();
   if ( get_post_meta( $order_id, \'_nick_name\', true ) ) echo \'<p><strong>Nick Name:</strong> \' . get_post_meta( $order_id, \'_nick_name\', true ) . \'</p>\';
}
 
add_action( \'woocommerce_email_after_order_table\', \'md_show_new_checkout_field_emails\', 20, 4 );
  
function bbloomer_show_new_checkout_field_emails( $order, $sent_to_admin, $plain_text, $email ) {
    if ( get_post_meta( $order->get_id(), \'_nick_name\', true ) ) echo \'<p><strong>Nick Name:</strong> \' . get_post_meta( $order->get_id(), \'_nick_name\', true ) . \'</p>\';
}