Add a Custom Checkbox in Woocommerce Checkout Which Value Shows in Admin Edit Order

Add a custom checkbox in WooCommerce checkout which value shows in admin edit order

You can do it in 3 steps:

1. Adding the custom checkbox field below the Payment Methods
2. Saving the custom checkbox field when it's checked in the order meta
3. Displaying the custom checkbox field when it's checked on the order edit page

Here is that code:

// Add custom checkout field: woocommerce_review_order_before_submit
add_action( 'woocommerce_review_order_before_submit', 'my_custom_checkout_field' );
function my_custom_checkout_field() {
    echo '<div id="my_custom_checkout_field">';

    woocommerce_form_field( 'my_field_name', array(
        'type'      => 'checkbox',
        'class'     => array('input-checkbox'),
        'label'     => __('My custom checkbox'),
    ),  WC()->checkout->get_value( 'my_field_name' ) );
    echo '</div>';
}

// Save the custom checkout field in the order meta, when checkbox has been checked
add_action( 'woocommerce_checkout_update_order_meta', 'custom_checkout_field_update_order_meta', 10, 1 );
function custom_checkout_field_update_order_meta( $order_id ) {

    if ( ! empty( $_POST['my_field_name'] ) )
        update_post_meta( $order_id, 'my_field_name', $_POST['my_field_name'] );
}

// Display the custom field result on the order edit page (backend) when checkbox has been checked
add_action( 'woocommerce_admin_order_data_after_billing_address', 'display_custom_field_on_order_edit_pages', 10, 1 );
function display_custom_field_on_order_edit_pages( $order ){
    $my_field_name = get_post_meta( $order->get_id(), 'my_field_name', true );
    if( $my_field_name == 1 )
        echo '<p><strong>My custom field: </strong> <span style="color:red;">Is enabled</span></p>';
}

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

Tested in WooCommerce 3+ and works. When the checkbox has been checked, it display a custom text below billing address in order edit page…

Display Checkbox Field Data in Order Email & Order Edit Page

Here both fields are merged, saved and displayed in order admin and email notifications:

// Get "hearaboutus" select field options data
function wc_get_hearaboutus_options(){
    return array(
        ''          => 'Please select...',
        'option_1'  => 'Social Media (e.g Facebook)',
        'option_2'  => 'Search Engine (e.g Google)',
        'option_3'  => 'Meditation Class',
        'option_4'  => 'Leaflets/Flyers/Posters',
        'option_5'  => 'Website',
        'option_6'  => 'Email Newsletter',
        'option_7'  => 'Other',
    );
}

// Add the fields to the checkout
add_action( 'woocommerce_after_order_notes', 'my_custom_checkout_field' );
function my_custom_checkout_field( $checkout ) {

    echo '<div id="my_custom_checkout_field">
    <h3>' . __('Please help us understand our customers so that we can improve future events (Optional)') . '</h3>';

    woocommerce_form_field( '_hearaboutus', array(
        'type'    => 'select',
        'class'   => array('my-field-class form-row-wide'),
        'label'   => __('How did you hear about us?  '),
        'options' => wc_get_hearaboutus_options(),
    ), $checkout->get_value( '_hearaboutus' ) );

    echo '</div>';

    echo '<div class="cw_custom_class">
    <h2>'.__('Would you like to be added to the WhatsApp list?').'</h2>';

    $whatsapp_list =

    woocommerce_form_field( 'whatsapp_list', array(
        'type'          => 'checkbox',
        'label'         => __("Yes, add me to the list!", "woocommerce"),
        'required'  => false,
    ), $checkout->get_value( 'whatsapp_list' ) );

    echo '</div>';
}

// Update the order meta with fields values
add_action( 'woocommerce_checkout_create_order', 'custom_checkout_field_create_order', 10, 2 );
function custom_checkout_field_create_order( $order, $data ) {
    if ( isset($_POST['_hearaboutus']) && ! empty($_POST['_hearaboutus']) ) {
         $order->update_meta_data( '_hearaboutus', sanitize_text_field($_POST['_hearaboutus']) );
    }
    if ( isset($_POST['whatsapp_list']) ) {
        $order->update_meta_data( '_whatsapp_list', 'Yes' );
    }
}

// Add the fields to order email
add_action('woocommerce_email_order_details', 'action_after_email_order_details', 25, 4 );
function action_after_email_order_details( $order, $sent_to_admin, $plain_text, $email ) {

    if( $hearaboutus = $order->get_meta('_hearaboutus') ) {
        // The data 1
        $label1 = __('How did you hear about us?');
        $value1 = wc_get_hearaboutus_options()[$hearaboutus];
    }

    if( $whatsapp_list = $order->get_meta('_whatsapp_list') ) {
        // The data 1
        $label2 = __('Add me to WhatsApp list?');
        $value2 = $whatsapp_list;
    }

    if( isset($value1) && isset($value2) ){
        // The HTML Structure
        $html_output = '<h2>' . __('Extra data') . '</h2>
        <div class="discount-info"><table cellspacing="0" cellpadding="6">';
        if( isset($value1) ){
            $html_output .= '<tr><th>' . $label1 . '</th><td>' . $value1 . '</td></tr>';
        }
        if( isset($value2) ){
            $html_output .= '<tr><th>' . $label2 . '</th><td>' . $value2 . '</td></tr>';
        }
        $html_output .= '</tr></tbody></table></div><br>';

        // The CSS styling
        $styles = '<style>
            .discount-info table{width: 100%; font-family: \'Helvetica Neue\', Helvetica, Roboto, Arial, sans-serif;
                color: #737373; border: 2px solid #e4e4e4; margin-bottom:8px;}
            .discount-info table th, table.tracking-info td{ text-align: left; color: #737373; border: none; padding: 12px;}
            .discount-info table td{ text-align: left; color: #737373; border: none; padding: 12px; }
        </style>';

        // The Output CSS + HTML
        echo $styles . $html_output;
    }
}

// Display field value on the order edit page
add_action( 'woocommerce_admin_order_data_after_billing_address', 'my_custom_checkout_field_display_admin_order_meta', 10, 1 );
function my_custom_checkout_field_display_admin_order_meta( $order ) {
    if( $hearaboutus = $order->get_meta('_hearaboutus') ) {
        $value = wc_get_hearaboutus_options()[$hearaboutus];
        echo '<p><strong>'.__('How did you hear about us?').'</strong> ' . $value . '</p>';
    }
    $whatsapp_list = $order->get_meta('_whatsapp_list');
    $value = $whatsapp_list === 'Yes' ? 'Yes' : 'No';
    echo '<p><strong>'.__('Added to WhatsApp list?').'</strong> ' . $value . '</p>';
}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

WooCommerce admin product custom checkbox field not saving value

There is some missing thing in your code and your last hooked function hook can be replaced with a better one since WooCommerce version 3. Try the following instead:

add_action( 'woocommerce_product_options_sku', 'custom_checkbox_field_product_options_sku' );
function custom_checkbox_field_product_options_sku(){
    global $post, $product_object;

    if ( ! is_a( $product_object, 'WC_Product' ) ) {
        $product_object = wc_get_product( $post->ID );
    }

    $values = $product_object->get_meta('custom_checkbox_field');

    woocommerce_wp_checkbox( array(
        'id'            => 'custom_checkbox_field',
        'value'         => empty($values) ? 'yes' : $values, // Checked by default
        'label'         => __( 'Label', 'woocommerce' ),
        'description'   => __( 'Description', 'woocommerce' ),
    ) );
}

add_action( 'woocommerce_admin_process_product_object', 'save_custom_field_product_options_sku' );
function save_custom_field_product_options_sku( $product ) {
    $product->update_meta_data( 'custom_checkbox_field', isset($_POST['custom_checkbox_field']) ? 'yes' : 'no' );
}

Code goes in functions.php file of the active child theme (or active theme). Tested and works.

Add a checkbox to show/hide checkout fields and display the values ​in WooCommerce backend

Besides the fact that you use new_billing_field and _new_billing_field interchangeably (note the underscore), do you not have code to effectively save the values ​​from the fields, before you can display them in other locations.

So you get:

function action_woocommerce_before_checkout_form() {
    ?>
    <style>
    p#new_billing_field_field.on { display:none !important; }
    p#new_billing_field2_field.on { display:none !important; }
    p#new_billing_field3_field.on { display:none !important; }
    </style>

    <script type="text/javascript">
    jQuery(function($){
        var a = 'input#checkbox_trigger';
        var b = '#new_billing_field_field,#new_billing_field2_field,#new_billing_field3_field';

        $(a).change(function() {
            if ( $(this).prop('checked') === true && $(b).hasClass('on') ) {
                $(b).show(function(){
                    $(b).css({'display':'none'}).removeClass('on').show();
                });
            }
            else if ( $(this).prop('checked') !== true && ! $(b).hasClass('on') ) {
                $(b).fadeOut(function(){
                    $(b).addClass('on')
                });
                $(b+' input').val('');
            }
        });
    });
    </script>
    <?php
}
add_action( 'woocommerce_before_checkout_form', 'action_woocommerce_before_checkout_form' );

function filter_woocommerce_checkout_fields( $fields ) {
    $fields['billing']['checkbox_trigger'] = array(
        'type'          => 'checkbox',
        'label'         => __( 'Ostan ettevõttena', 'woocommerce' ),
        'class'         => array( 'form-row-wide' ),
        'clear'         => true
    );

    $fields['billing']['new_billing_field'] = array(
        'label'         => __( 'Ettevõtte nimi', 'woocommerce' ),
        'placeholder'   => _x( 'Ettevõtte nimi', 'placeholder', 'woocommerce' ),
        'class'         => array( 'form-row-wide on' ),
        'clear'         => true
    );
    
    $fields['billing']['new_billing_field2'] = array(
        'label'         => __( 'Ettevõtte registrikood ', 'woocommerce' ),
        'placeholder'   => _x( 'Ettevõtte registrikood ', 'placeholder', 'woocommerce' ),
        'class'         => array( 'form-row-wide on' ),
        'clear'         => true
    );
      $fields['billing']['new_billing_field3'] = array(
        'label'         => __( 'Ettevõtte aadress', 'woocommerce' ),
        'placeholder'   => _x( 'Ettevõtte aadress', 'placeholder', 'woocommerce' ),
        'class'         => array( 'form-row-wide on' ),
        'clear'         => true
    );
    
    return $fields;
}
add_filter( 'woocommerce_checkout_fields', 'filter_woocommerce_checkout_fields', 10, 1 );

// Save fields
function action_woocommerce_checkout_create_order( $order, $data ) {
    // Isset and NOT empty, save
    if ( isset( $_POST['new_billing_field'] ) && ! empty( $_POST['new_billing_field'] ) ) {
        // Update meta data
        $order->update_meta_data( '_new_billing_field', sanitize_text_field( $_POST['new_billing_field'] ) );
    }
    
    if ( isset( $_POST['new_billing_field2'] ) && ! empty( $_POST['new_billing_field2'] ) ) {
        // Update meta data
        $order->update_meta_data( '_new_billing_field2', sanitize_text_field( $_POST['new_billing_field2'] ) );
    }
    
    if ( isset( $_POST['new_billing_field3'] ) && ! empty( $_POST['new_billing_field3'] ) ) {
        // Update meta data
        $order->update_meta_data( '_new_billing_field3', sanitize_text_field( $_POST['new_billing_field3'] ) );
    }
}
add_action( 'woocommerce_checkout_create_order', 'action_woocommerce_checkout_create_order', 10, 2 );

// Display field values on admin order pages after billing adress
function action_woocommerce_admin_order_data_after_billing_address( $order ) {  
    // Get meta
    $new_billing_field = $order->get_meta( '_new_billing_field' );
    
    // NOT empty
    if ( ! empty ( $new_billing_field ) ) {
        echo '<p><strong>' . __( 'Ostan ettevõttena', 'woocommerce' ) . ':</strong> ' . $new_billing_field . '</p>';
    }
    
    // Get meta
    $new_billing_field2 = $order->get_meta( '_new_billing_field2' );
    
    // NOT empty
    if ( ! empty ( $new_billing_field2 ) ) {
        echo '<p><strong>' . __( 'Ettevõtte aadress', 'woocommerce' ) . ':</strong> ' . $new_billing_field2 . '</p>';
    }
    
    // Get meta
    $new_billing_field3 = $order->get_meta( '_new_billing_field3' );
    
    // NOT empty
    if ( ! empty ( $new_billing_field3 ) ) {
        echo '<p><strong>' . __( 'Competitor dob day', 'woocommerce' ) . ':</strong> ' . $new_billing_field3 . '</p>';
    }
}
add_action( 'woocommerce_admin_order_data_after_billing_address', 'action_woocommerce_admin_order_data_after_billing_address', 10, 1 );

Display custom checkout field value on admin order detail section in Woocommerce

There is some mistakes, so I have revisited your code. I have also replaced some hooks. Try the following:

// HERE set your the options array for your select field.
function delivery_time_options(){
    $domain = 'woocommerce';
    return array(
        '1' => __('10:04 : 13:04 ', $domain),
        '2' => __('14:04 : 16:04 ', $domain), // <== Added for testing
    );
}

// Display a custom select field after shipping total line
add_action( 'woocommerce_review_order_after_shipping', 'checkout_shipping_additional_field', 20 );
function checkout_shipping_additional_field(){
    $domain = 'woocommerce';

    echo '<tr class="additional-shipping-fields"><th>' . __('Delivery Time', $domain) . '</th><td>';

    // Add a custom select field
    woocommerce_form_field( 'delivery_time', array(
        'type' => 'select',
        'class' => array( 'form-row-wide' ),
        'options' => delivery_time_options(),
    ), '' );

    echo '</td></tr>';
}

// Save custom field as order meta data
add_action('woocommerce_checkout_create_order', 'save_custom_field_order_meta', 22, 2 );
function save_custom_field_order_meta( $order, $data ) {
    if ( isset($_POST['delivery_time']) ) {
        $options    = delivery_time_options(); // Get select options array
        $option_key = esc_attr($_POST['delivery_time']); // The selected key

        $order->update_meta_data( '_delivery_time', $options[$option_key] ); // Save
    }
}

// Display a custom field value on the admin order edit page
add_action( 'woocommerce_admin_order_data_after_shipping_address', 'display_custom_meta_data_in_backend_orders', 10, 1 );
function display_custom_meta_data_in_backend_orders( $order ){
    $domain = 'woocommerce';

    $delivery_time = $order->get_meta('_delivery_time');
    if( ! empty( $delivery_time ) )
        echo '<p><strong>'.__('Delivery Time', $domain).': </strong> ' . $delivery_time . '</p>';
}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

Display checkout field value in Woocommerce admin order list custom column

The following revisited code will add a custom column and will display the custom checkout field "Enclosed Invoice" value:

// Add custom checkbox field to checkout
add_action( 'woocommerce_review_order_before_submit', 'my_custom_checkout_field' );

function my_custom_checkout_field() {
    echo '<div id="my_custom_checkout_field">';

    woocommerce_form_field( '_enclosed_invoice', array(
        'type'      => 'checkbox',
        'class'     => array('input-checkbox'),
        'label'     => __('Enclose invoice? (Otherwise only delivery note)'),
    ),  WC()->checkout->get_value( '_enclosed_invoice' ) );

    echo '</div>';
}

// Save the custom checkout field in the order meta, when checkbox has been checked
add_action( 'woocommerce_checkout_create_order', 'save_order_custom_meta_data', 10, 2 );
function save_order_custom_meta_data( $order, $data ) {
    if ( isset($_POST['_enclosed_invoice']) )
        $order->update_meta_data('_enclosed_invoice', '1' );
}

// Display the custom field result on the order edit page (backend) when checkbox has been checked
add_action( 'woocommerce_admin_order_data_after_billing_address', 'display_custom_field_on_order_edit_pages', 10, 1 );
function display_custom_field_on_order_edit_pages( $order ){
    if( $my_field_name = $order->get_meta( '_enclosed_invoice' ) )
        echo '<p style="background: #dba029; padding: 1em !important; color: #fff; font-weight: 700;"><strong>Enclosed invoice!</strong></p>';
}

// Add custom column before "Actions" column in admin orders list
add_filter('manage_edit-shop_order_columns', 'add_enclosed_invoice_order_column', 10, 1 );
function add_enclosed_invoice_order_column( $columns ) {
    // Woocommerce compatibility since version 3.3
    $actions_key = isset($columns['wc_actions']) ? 'wc_actions' : 'order_actions';

    $order_actions = $columns[$actions_key];

    unset($columns[$actions_key]);

    $columns['enclosed_invoice'] = __("Enc. Invoice", "woocommerce");

    $columns[$actions_key] = $order_actions;

    return $columns;
}

// Display data to custom column in admin orders list
add_action( 'manage_shop_order_posts_custom_column' , 'display_enclosed_invoice_order_column_data' );
function display_enclosed_invoice_order_column_data( $column ) {
    global $the_order, $post;

    if( $column  == 'enclosed_invoice' ) {
        if( $enclosed_invoice = $the_order->get_meta( '_enclosed_invoice' ) ) {
            echo __("Yes", "woocommerce");
        } else {
            echo ' - ';
        }
    }
}

Code goes in function.php file of your active child theme (active theme). tested and works.

Since Woocommmerce version 3.3, the admin order list actions column has been renamed 'wc_actions' instead of 'order_actions'

Unable to save custom checkbox value from WooCommerce checkout

Give it a try in the following way

function add_field_sendy_woocommerce_agree( $checkout ) {

    woocommerce_form_field( 'sendy_woocommerce_agree', array(
        'type'          => 'checkbox',
        'label'         => __('Subscribe to our Newsletter.'),
        'required'  => false,
        'default' => 1 
    ),  $checkout->get_value( 'sendy_woocommerce_agree' ));                               
}
add_filter( 'woocommerce_after_checkout_billing_form' , 'add_field_sendy_woocommerce_agree', 10, 1 );

// Save
function action_woocommerce_checkout_create_order( $order, $data ) {
    if ( isset($_POST['sendy_woocommerce_agree']) && ! empty($_POST['sendy_woocommerce_agree']) ) {
        $order->update_meta_data( 'sendy_woocommerce_agree', sanitize_text_field( $_POST['sendy_woocommerce_agree'] ) );
    } 
}
add_action( 'woocommerce_checkout_create_order', 'action_woocommerce_checkout_create_order', 10, 2 );

// Display the custom field value on admin order pages after billing adress:
function action_woocommerce_admin_order_data_after_billing_address( $order ) {
    echo '<p><strong>'.__('Sendy').':</strong> ' . $order->get_meta('sendy_woocommerce_agree') . '</p>'; 
}
add_action( 'woocommerce_admin_order_data_after_billing_address', 'action_woocommerce_admin_order_data_after_billing_address', 10, 1 );

Add checkbox to product inventory tab in WooCommerce and have the checkbox checked by default

woocommerce_admin_process_product_object replaces the outdated woocommerce_process_product_meta hook so you should definitely not replace it with it

To have the checkbox checked by default you can add value to the args from woocommerce_wp_checkbox()

So you get:

// Add checkbox
function action_woocommerce_product_options_inventory_product_data() {
    global $product_object;
    
    // Get meta
    $value = $product_object->get_meta( '_cutom_meta_key' );
    
    // Checkbox
    woocommerce_wp_checkbox( array( 
        'id'            => '_cutom_meta_key', // Required, it's the meta_key for storing the value (is checked or not)
        'label'         => __( 'Custom label', 'woocommerce' ), // Text in the editor label
        'desc_tip'      => false, // true or false, show description directly or as tooltip
        'description'   => __( 'Enable this to make something', 'woocommerce' ), // Provide something useful here
        'value'         => empty( $value ) ? 'yes' : $value // Checked by default
    ) );
}
add_action( 'woocommerce_product_options_inventory_product_data', 'action_woocommerce_product_options_inventory_product_data', 10, 0 );
        
// Save Field
function action_woocommerce_admin_process_product_object( $product ) {
    // Update meta
    $product->update_meta_data( '_cutom_meta_key', isset( $_POST['_cutom_meta_key'] ) ? 'yes' : 'no' );
}
add_action( 'woocommerce_admin_process_product_object', 'action_woocommerce_admin_process_product_object', 10, 1 );

---

Related Topics