WooCommerce - Overriding billing state and post code on existing checkout fields
10,755
Solution 1
This is the complete way for billing state and billing post code override, keeping the billing selector with options.
Here is the code the fully functional and tested code:
- Unsetting billing state and post code checkout fields
add_filter( 'woocommerce_checkout_fields' , 'partial_unsetting_checkout_fields' );
function partial_unsetting_checkout_fields( $fields ) {
unset($fields['billing']['billing_state']);
unset($fields['billing']['billing_postcode']);
return $fields;
}
- Reinserting custom billing state and post code checkout fields
add_filter( 'woocommerce_default_address_fields' , 'art_override_default_address_fields' );
function art_override_default_address_fields( $address_fields ) {
// @ for state
$address_fields['billing_state']['type'] = 'select';
$address_fields['billing_state']['class'] = array('form-row-wide');
$address_fields['billing_state']['required'] = true;
$address_fields['billing_state']['label'] = __('State', 'my_theme_slug');
$address_fields['billing_state']['placeholder'] = __('Enter state', 'my_theme_slug');
$address_fields['billing_state']['default'] ='Choice 1';
$address_fields['billing_state']['options'] = array(
'option_1' => 'Choice 1',
'option_2' => 'Choice 2',
'option_3' => 'Choice 3'
);
// @ for postcode
$address_fields['billing_postcode']['type'] = 'text';
$address_fields['billing_postcode']['class'] = array('form-row-wide');
$address_fields['billing_postcode']['required'] = true;
$address_fields['billing_postcode']['label'] = __('Postcode', 'my_theme_slug');
$address_fields['billing_postcode']['placeholder'] = __('Enter your postcode', 'my_theme_slug');
return $address_fields;
}
Naturally this goes on function.php file of your active child theme or theme
Official reference: WooThemes - Customizing checkout fields using actions and filters
Note concerning the
'class'
propertyThere is 2 ways to handle it:
- The field is alone in one line (width 100%), you use:
'form-row-wide'
- There is 2 fields side by side on the same line, you use:
'form-row-first'
for the first field'form-row-last'
for the second field
Solution 2
//-------------------------- OVERRIDING BILLING STATE FIELD -------------------------------//
//Removing previous one by using unset
add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
// Our hooked in function - $fields is passed via the filter!
function custom_override_checkout_fields( $fields ) {
unset($fields['billing']['billing_state']);
return $fields;
}
add_filter( 'woocommerce_default_address_fields' , 'art_override_default_address_fields' );
function art_override_default_address_fields( $address_fields ) {
// @ for state
$address_fields['Billing_State']['type'] = 'text';
$address_fields['Billing_State']['class'] = array('form-row-wide');
$address_fields['Billing_State']['required'] = true;
$address_fields['Billing_State']['label'] = __('State', 'my_theme_slug');
$address_fields['Billing_State']['placeholder'] = __('Enter state', 'my_theme_slug');
return $address_fields;
}
Author by
art
Updated on July 28, 2022Comments
-
art almost 2 years
I can't find the way to ovveride billing state and post code.
How can I edit the other parts of existing billing fields like billing state and post code?
This is what I have in the
functions.php
file in my child theme (I have included the code affecting the billing part):<?php function my_custom_checkout_field( $checkout ) { global $wpdb; $check_zone = $wpdb->get_results("select area_name from brick_area where id='".$_SESSION['area']."'",ARRAY_A); if(!empty($check_zone)){ $check_zoneid = $check_zone['0']; } woocommerce_form_field( 'my_field_name', array( 'type' => 'text', 'class' => array('my-field-class form-row-wide'), 'label' => __('Delivery Area'), 'placeholder' => __('Area'), 'readonly' =>'readonly', 'default' => $check_zoneid['area_name'] ), $checkout->get_value( 'my_field_name' )); woocommerce_form_field( 'my_expected_date', array( 'type' => 'text', 'class' => array('my-field-class form-row-wide'), 'required' => true, 'label' => __('Expected Delivery Date'), 'placeholder' => __('Enter expected delivery date.'), ), $checkout->get_value( 'my_expected_date' )); /*woocommerce_form_field( 'my_expected_time', array( 'type' => 'text', 'class' => array('my-field-class form-row-wide'), 'required' => true, 'label' => __('Expected Delivery Time'), 'placeholder' => __('Enter expected delivery time.'), ), $checkout->get_value( 'my_expected_time' ));*/ woocommerce_form_field( 'site_contact_name', array( 'type' => 'text', 'class' => array('my-field-class form-row-wide'), 'required' => true, 'label' => __('Site Contact Person Name'), 'placeholder' => __('Enter site contact person name.'), ), $checkout->get_value( 'site_contact_name' )); woocommerce_form_field( 'site_contact_phone', array( 'type' => 'tel', 'class' => array('my-field-class form-row-wide'), 'required' => true, 'label' => __('Site Contact Phone Number'), 'placeholder' => __('Enter site contact phone number.'), ), $checkout->get_value( 'site_contact_phone' )); } $fields['billing']['billing_city']['default'] = $_SESSION['cn']; add_filter( 'woocommerce_default_address_fields' , 'custom_override_default_address_fields' ); function custom_override_default_address_fields( $address_fields ) { // we are changing here billing_state field to required $fields['billing']['billing_state']['required'] = true; return $address_fields; } /*$fields['billing']['my_field_name']['default'] = $check_zoneid['area_name']; $fields['billing']['my_field_name']['label'] = 'Area';*/ return $fields; } ?>
Thanks
-
juanchod about 3 yearsIn my case, I put is_logged_in so users without profile have to enter their address