How to Hide or Move Order Notes on Checkout Page of WooCommerce?

Photo of author
Written By geekerhub

Lorem ipsum dolor sit amet consectetur pulvinar ligula augue quis venenatis. 

Sometimes default features of any plugins or themes are annoying to us as an end-user. ‘Order Notes’ of WooCommerce which exists below the shipping form on the checkout page is one of the same.

So this tutorial will guide you on how to remove or move this order notes using WooCommerce filters. Filter associated with Order Notes is ‘woocommerce_enable_order_notes_field’

So to Remove the Order Notes, you need to add below line of code in your functions.php

/*
* Remove Order Notes on WooCommerce Checkout Page
*/
add_filter( 'woocommerce_enable_order_notes_field', '__return_false' );

First you need to remove the default location of Order Notes using the above filter.
You need to use ‘woocommerce_checkout_fields’ filter to add a new Order Notes field as per WooCommerce Standard.
You need to use ‘woocommerce_checkout_create_order’ filter to store data on the newly created Order Notes field.

/*Hide default Order Notes*/
add_filter( 'woocommerce_enable_order_notes_field', '__return_false' );
/*Create  New Order Notes Field*/
add_filter( 'woocommerce_checkout_fields' , 'geekerhub_order_notes_field_callback' );
 
function geekerhub_order_notes_field_callback( $fields ) {
   $fields['billing']['new_order_notes'] = array(
      'type' => 'textarea',
      'label' => 'Order Notes',
      'class' => array('form-row-wide'),
      'clear' => true,
      'priority' => 999,
   );
   return $fields;
}
/*Save Order Notes when order is Created*/
add_action( 'woocommerce_checkout_create_order', 'geekerhub_store_order_notes_callback', 10, 2 );
 
function geekerhub_store_order_notes_callback( $order, $data ) {
  $ordernotes = isset( $data['new_order_notes'] ) ? $data['new_order_notes'] : '';
    $order->set_customer_note( $ordernotes );
}

Leave a Comment