You Are Here
PHPStackoverflow

How to Move Order Notes at Checkout page in WooCommerce?

PHP

The order notes are generally present below the shipping form. Using these short notes, you can include additional information that has been missed beforehand. So, the further order related procedures could run smoothly. For instance, giving special instructions for delivery purposes through order notes. In this article, you will learn to move order notes at checkout page. 

Firstly, we will remove order notes from shipping form which is its default location. After that, you will learn to include them in the billing form. So, basically, it is a combination snippet. You remove these notes & then create a fresh billing form. Finally, you save this new field in the default order notes custom field meta. 

Further, I have provided the snippet for the same. Just copy this snippet and see the improved functionality. 

Image showing how to move order notes at checkout

PHP Snippet: Move Order Notes at Checkout or under Billing Form 

// 1. Hide default notes
 
add_filter( 'woocommerce_enable_order_notes_field', '__return_false' );
 
// 2. Create new billing field
 
add_filter( 'woocommerce_checkout_fields' , 'phpsof_custom_order_notes' );
 
function phpsof_custom_order_notes( $fields ) {
   $fields['billing']['new_order_notes'] = array(
      'type' => 'textarea',
      'label' => 'New Order Notes',
      'class' => array('form-row-wide'),
      'clear' => true,
      'priority' => 999,
   );
   return $fields;
}
 
// 3. Save to existing order notes
 
add_action( 'woocommerce_checkout_update_order_meta', 'phpsof_custom_field_value_to_order_notes', 10, 2 );
 
function phpsof_custom_field_value_to_order_notes( $order_id, $data ) {
   if ( ! is_object( $order_id ) ) {
      $order = wc_get_order( $order_id );
   }
   $order->set_customer_note( isset( $data['new_order_notes'] ) ? $data['new_order_notes'] : '' );
   wc_create_order_note( $order_id, $data['new_order_notes'], true, true );
   $order->save();
}

Where do you add this snippet?

So, this is how you move order notes at checkout page. Also, it is easier to activate this function with this code. So, to apply this code, just add this PHP snippet at your child theme function.php file’s bottom. It should be placed before “?>”, if you have it there. Apart from this, CSS goes in your child theme style.css file. Make sure that you are editing these files in a right manner for best results.

Is this snippet still valid?

So, this way, you move order notes at checkout page. I have applied this code on the Storefront theme and WordPress friendly hosting PHP 7.3. Let me know if everything works as expected when you code. Share it further if you find this snippet useful for you and it had saved your time. 

Also Read, How to automatically hide WooCommerce checkout field?

How to Exclude Product from Discount Coupons in WooCommerce?

Important links: WooCommerce – https://woocommerce.com/

Related Posts