How to Add a product note field in single product pages in Woocommerce

You can add a product note field to single product pages in WooCommerce by using the following steps:

1. Create a child theme for your WooCommerce site. This ensures that any customizations you make will not be overwritten when the parent theme or WooCommerce plugin is updated.
2. In your child theme, create a new file called “functions.php”
3. In functions.php, you can use the woocommerce_before_add_to_cart_button action hook to add a custom field to the single product page. You can add the following code snippet to your functions.php file:

Copy codefunction add_product_note_field() {
    echo '<div class="product-note">';
    echo '<label for="product_note">' . __( 'Product Note', 'woocommerce' ) . '</label>';
    echo '<textarea id="product_note" name="product_note"></textarea>';
    echo '</div>';
}
add_action( 'woocommerce_before_add_to_cart_button', 'add_product_note_field' );

4. This code will add a text area field on the single product page before the “add to cart” button.
5. To save the note, you can use the woocommerce_add_cart_item_data filter to add the note as an item data. You can add the following code snippet to your functions.php file:

Copy codefunction save_product_note_field( $cart_item_data, $product_id ) {
    if( isset( $_POST['product_note'] ) ) {
        $cart_item_data[ 'product_note' ] = sanitize_text_field( $_POST['product_note'] );
    }
    return $cart_item_data;
}
add_filter( 'woocommerce_add_cart_item_data', 'save_product_note_field', 10, 2 );

6. Finally, you can use the woocommerce_get_item_data filter to display the note in the cart and checkout pages. You can add the following code snippet to your functions.php file:

Copy codefunction display_product_note_field( $item_data, $cart_item ) {
    if( isset( $cart_item['product_note'] ) ) {
        $item_data[] = array(
            'key'     => __( 'Product Note', 'woocommerce' ),
            'value'   => wc_clean( $cart_item['product_note'] ),
            'display' => '',
        );
    }
    return $item_data;
}
add_filter( 'woocommerce_get_item_data', 'display_product_note_field', 10, 2 );

Please keep in mind that this solution requires some knowledge of PHP and WordPress development. Also, be aware that modifying the core files of the plugin or theme may cause issues when you update them, so it’s always recommended to use a child theme or custom plugin to add customizations.