WordPress   

Add custom field in Woocommerce checkout, my account page, profile page, edit order page, thanks page and emails.

This code snippet can be used to add any number of custom fields in the woocommerce checkout page, my account page and edit profile page in the backend. You can easily customize this code snippet according to your requirements. In this example we are adding customer_type and gst_number fields. To implement this whole method you need to add the final customized code snippets into the functions.php file of the active WP theme.

 

Step 1: Add custom fields in the checkout page and my account’s edit address page

//Add custom fields in checkout page and my account edit address page
add_filter( 'woocommerce_default_address_fields', 'rp_add_custom_fields_woo_checkout_my_account' );
function rp_add_custom_fields_woo_checkout_my_account($fields) {
    $fields['customer_type'] = array(
        'label' => 'Customer Type',
        'type'  => 'radio',
        'required' => true,
        'class' => array( 'form-row-wide'),
        'options' => array(
            'individual' => 'Individual',
            'business' => 'Business',			
        ),
        'priority' => 25,
    );
    $fields['gst_number'] = array(
        'label' => 'GST Number',
        'placeholder' => __('Your GST number', 'woocommerce'),
        'type'  => 'text',
        'required' => false,
        'class' => array( 'form-row-wide'),
        'priority' => 25,
    );
	return $fields;
}

 

Step 2: Add custom fields to the profile page in the backend

//Add custom fields in the profile page(backend)
add_action( 'show_user_profile', 'rp_custom_fields_edit_profile_page' );
add_action( 'edit_user_profile', 'rp_custom_fields_edit_profile_page' );
function rp_custom_fields_edit_profile_page( $user )
{
 ?>
   <h3><?php _e("Customer Type", "text-domain"); ?></h3>
        <table class="form-table <?php echo $fieldCountryClass; ?>">
            <tr>
                <th><label for="entity_type_wcd_"><?php _e("Customer Type", "text-domain"); ?> </label></th>
                <td>
                    <input type="radio" class="input-radio" id="customer_type_individual" value="individual" name="customer_type" <?php if( 'individual' == esc_attr(get_user_meta( $user->ID, 'billing_customer_type', true ))){ echo 'checked';} ?>>
                    <label for="customer_type_individual" class="radio">Individual</label>
                    <input type="radio" class="input-radio" id="customer_type_business" value="business" name="customer_type" <?php if( 'business' == esc_attr(get_user_meta( $user->ID, 'billing_customer_type', true ))){ echo 'checked';} ?>>
                    <label for="customer_type_business" class="radio">Business</label>
                </td>
             </tr>
            <tr>
                <th><label for="gst_number"><?php _e("GST Number", "text-domain"); ?> </label></th>
                <td><input type="text" name="gst_number" value="<?php echo esc_attr(get_user_meta( $user->ID, 'billing_gst_number', true )); ?>" class="regular-text" /></td>
            </tr>
        </table>
        <br />
    <?php 
}

 

Step 3: Add validation to the newly added fields in the profile page(backend)

//Validate fields in the edit profile page(backend)
add_action('user_profile_update_errors','rp_validate_custom_fields_edit_profile_page_backend',10,1);
function rp_validate_custom_fields_edit_profile_page_backend($args)
{
    if(isset($_POST['customer_type']) && empty($_POST['customer_type']) ) {
        $args->add( 'error', __( '<strong>Customer type</strong> is a required field.', 'woocommerce' ),'');
    }
}

 

Step 4: Save custom field values in the profile page(backend)

//Save field data from the edit profile page(backend)
add_action( 'personal_options_update', 'rp_save_custom_fields_edit_profile_' );
add_action( 'edit_user_profile_update', 'rp_save_custom_fields_edit_profile_' );
function rp_save_custom_fields_edit_profile_( $user_id )
{
    if ( isset($_POST['customer_type']) ) {
        update_user_meta( $user_id, 'billing_customer_type', sanitize_text_field( $_POST['customer_type'] ) );
    }
    if ( isset($_POST['gst_number']) ) {
        update_user_meta( $user_id, 'billing_gst_number', sanitize_text_field( $_POST['gst_number'] ) );
    }
}

 

Step 5: Save custom field values into the order meta when a new order is created

//Save custom fields in order meta
add_action( 'woocommerce_checkout_update_order_meta', 'rp_save_custom_fields_order_meta' );
function rp_save_custom_fields_order_meta( $order_id ) {
    if ( ! empty( $_POST['billing_customer_type'] ) ) {
        update_post_meta( $order_id, 'customer_type', sanitize_text_field( $_POST['billing_customer_type'] ) );
    }
    if ( ! empty( $_POST['billing_gst_number'] ) ) {
        update_post_meta( $order_id, 'gst_number', sanitize_text_field( $_POST['billing_gst_number'] ) );
    }
}

 

Step 6: Show custom field values in the order edit page(backend)

//Display custom fields in the order edit page
add_action( 'woocommerce_admin_order_data_after_billing_address', 'rp_show_custom_fields_order_meta', 10, 1 );
function rp_show_custom_fields_order_meta($order){
    $customer_type = get_post_meta( $order->id, 'customer_type', true );
    $gst_number = get_post_meta( $order->id, 'gst_number', true );
    if($customer_type != ''){
        echo '<p><strong>'.__('Customer Type').':</strong> ' . $customer_type . '</p>';
    }
    if($gst_number != ''){
        echo '<p><strong>'.__('GST Number').':</strong> ' . $gst_number . '</p>';
    }
}

 

Step 7: Add custom field values in the thanks page

//Display fields on the order thanks page
add_action( 'woocommerce_thankyou', 'rp_show_custom_field_values_order_thanks_page', 20 );
function rp_show_custom_field_values_order_thanks_page( $orderID ){ 
    $customer_type = get_post_meta( $orderID, 'customer_type', true );
    $gst_number = get_post_meta( $orderID, 'gst_number', true );
    if($customer_type != ''){
        echo '<p><strong>'.__('Customer Type').':</strong> ' . $customer_type . '</p>';
    }
    if($gst_number != ''){
        echo '<p><strong>'.__('GST Number').':</strong> ' . $gst_number . '</p>';
    }
    ?>
<?PHP 
}

 

Step 8: Add custom field values in woocommerce emails

//Display custom fields in the order emails
add_action( 'woocommerce_email_order_meta', 'rp_add_custom_fields_order_emails', 10, 3 );
function rp_add_custom_fields_order_emails( $order, $sent_to_admin, $plain_text ){
    $customer_type = $order->get_meta( 'customer_type' );
    $gst_number =  $order->get_meta('gst_number');
    if ( false === $plain_text) { ?>
        <table class="td" cellspacing="0" cellpadding="6" style="margin-bottom:30px;color: #636363; border: 1px solid #e5e5e5; vertical-align: middle; width: 100%; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;" width="100%">
        <tr>
            <td class="td" style="color: #636363; border: 1px solid #e5e5e5; padding: 12px; text-align: left; vertical-align: middle; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; word-wrap: break-word;"><strong>Customer Type</strong></td>
            <td class="td" style="color: #636363; border: 1px solid #e5e5e5; padding: 12px; text-align: left; vertical-align: middle; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; word-wrap: break-word;"><?php echo $customer_type; ?></td>
        </tr>
        <tr>
            <td class="td" style="color: #636363; border: 1px solid #e5e5e5; padding: 12px; text-align: left; vertical-align: middle; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; word-wrap: break-word;"><strong>GST Number</strong></td>
            <td class="td" style="color: #636363; border: 1px solid #e5e5e5; padding: 12px; text-align: left; vertical-align: middle; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; word-wrap: break-word;"><?php echo $gst_number; ?></td>
        </tr>
    </table>
    <?php }
    else{
        echo "\nCustom Data\n"
                . "customer_type: $customer_type\n"
                . "gst_number: $gst_number\n";
    }
}
Need a helping hand in fixing your website issues?

If you are facing any problems in implementing these code snippets and tutorials, you can hire us to fix your website issues.

Hire Us