Add text to order summary based on a custom field value in WooCommerce

Question

I have added successfully a custom field to my WooCommerce checkout page that is a selector for different stores that the customer can choose to collect their items from. At

Answer 1

This is what you need:

• Format and save the "pickup data" as order meta data (for the customer - front end)
• Save the "pickup location" for admin order edit pages (for backend).
• Display the "pickup location" in admin order edit pages (in backend).
• Display the "pickup html formatted data" in order view and received pages (front end).
• Display the "pickup html formatted data" in email notifications (with embedded styles).

I have also revisited lightly your code:

add_filter( 'woocommerce_checkout_fields' , 'custom_store_pickup_field');
function custom_store_pickup_field( $fields ) {
    $fields['billing']['store_pickup'] = array(
        'type'     => 'select',
        'id'       => 'store_pickup_val',
        'label'    => __('Store Pick Up Location (Optional)', 'woocommerce'),
        'required' => true,
        'class'    => array('store-pickup form-row-wide'),
        'options'  => array(
            ''=> 'Please Select a Delivery Option',
            'option_1' => 'Delivery',
            'option_2' => 'Gym1',
            'option_3' => 'Gym2'
        ),
        'clear'     => true,
    );
    return $fields;
}

//* Process the checkout
add_action('woocommerce_checkout_process',  'wps_select_checkout_field_process');
function wps_select_checkout_field_process() {
    // Check if set, if its not set add an error.
    if ( $_POST['store_pickup'] == "option_0" )
        wc_add_notice( 'Please select a Delivery option', 'error' );
}


add_action( 'woocommerce_after_checkout_form', 'gym_opening_hours', 6 );
function gym_opening_hours() {
     ?>
    

Now the code you need to complete this process:

// Save the delivery location data to the order meta
add_action( 'woocommerce_checkout_update_order_meta', 'store_pickup_field_update_order_meta', 10, 1 );
function store_pickup_field_update_order_meta( $order_id ) {

    // BELOW update the data
    if ( $_POST['store_pickup'] == 'option_2' )
        $data = array( 
            'location' => 'Location 1', 
            'address' => '123 Beverly street
 90001 Los Angeles' 
        );
    elseif ( $_POST['store_pickup'] == 'option_3' )
        $data = array( 
        'location' => 'Location 2', 
        'address' => '456 Trumpet street
 90056 Los Angeles' 
    );

    $collect_info = 'Order can be collected between 4pm - 7pm on Tuesdays';

    if ( $_POST['store_pickup'] == 'option_2' || $_POST['store_pickup'] == 'option_3' ){
        // HTML
        $store_pickup = "
Pickup Information
        

            

                
Location:
                
".$data['location']."
            
            

                
Adress:
                
".$data['address']."
            
            

                
Info:
                
".$collect_info."
            
        
";

        // Save pickup html data (front end)
        update_post_meta( $order_id, '_store_pickup_data', $store_pickup );
        // Save pickup location (backend)
        update_post_meta( $order_id, '_store_pickup_location', $data['location'] );
    }
}

// Display 'pickup location' on the order edit page (backend)
add_action( 'woocommerce_admin_order_data_after_shipping_address', 'display_store_pickup_location_on_order_edit_pages', 10, 1 );
function display_store_pickup_location_on_order_edit_pages( $order ){
    $pickup_location = get_post_meta( $order->get_id(), '_store_pickup_location', true );
    if( ! empty( $pickup_location ) )
        echo '
Store pickup location:  ' . $pickup_location . '
';
}

// Display 'pickup html data' in "Order received" and "Order view" pages (frontend)
add_action( 'woocommerce_order_details_after_order_table', 'display_store_pickup_data_in_orders', 10 );
function display_store_pickup_data_in_orders( $order ) {
    $pickup_data = get_post_meta( $order->get_id(), '_store_pickup_data', true );
    if( ! empty( $pickup_data ) )
        echo $pickup_data;
}

// Display 'pickup html data' in Email notifications (frontend)
add_action( 'woocommerce_email_order_meta', 'display_store_pickup_data_in_emails', 10 );
function display_store_pickup_data_in_emails( $order ) {
    $pickup_data = get_post_meta( $order->get_id(), '_store_pickup_data', true );
    if( ! empty( $pickup_data ) ){
        // Email CSS style rules
        echo '';
        // Html data
        echo $pickup_data;
    }

}

Code goes in function.php file of your active child theme (or theme) or also in any plugin file.

Tested and works on WooCommerce 3+. So you will get this:

In Admin edit order page:

In Order view and order received pages:

In email notifications: