phpwordpresswoocommercecheckoutplaceholder

Customize some checkout fields properties in Woocommerce 3+


I have updated the placeholders for basket fields via the WooCommerce settings, as follows:

enter image description here

However on the frontend, the previous placeholders remain:

enter image description here

I have also used the following code, adapted from another StackOverflow thread which aims to override the placeholder content, but the defaults still persist.

add_filter('woocommerce_default_address_fields', 'override_default_address_checkout_fields', 20, 1);
function override_default_address_checkout_fields( $address_fields ) {
    $address_fields['state']['placeholder'] = 'State';
    $address_fields['postcode']['placeholder'] = 'Postcode';
    return $address_fields;
}

Please advise on how I can achieve the desired placeholder text!


Solution

  • In woocommerce default there is no settings like you describe. So you are using a third party plugin, to customize fields. So you need to try multiple ways with a higher hook priority.

    So try those one by one:

    1). Using woocommerce_default_address_fields filter hook (with a higher priority hook):

    add_filter('woocommerce_default_address_fields', 'customize_default_address_fields', 10000, 1 );
    function customize_default_address_fields( $address_fields ) {
        $address_fields['state']['placeholder'] = __('State', 'woocommerce');
        $address_fields['postcode']['placeholder'] = __('Postcode', 'woocommerce');
        return $address_fields;
    }
    

    2). Using woocommerce_checkout_fields filter hook (only for checkout):

    add_filter('woocommerce_checkout_fields', 'customize_checkout_fields', 10000, 1 );
    function customize_checkout_fields( $fields ) {
        $fields['billing']['billing_state']['placeholder'] = __('State', 'woocommerce');
        $fields['shipping']['shipping_state']['placeholder'] = __('State', 'woocommerce');
        $fields['billing']['billing_postcode']['placeholder'] = __('Postcode', 'woocommerce');
        $fields['shipping']['shipping_postcode']['placeholder'] = __('Postcode', 'woocommerce');
        return $fields;
    }
    

    3). Using woocommerce_billing_fields and woocommerce_shipping_fields filters hooks (for checkout and My Account addresses):

    add_filter('woocommerce_billing_fields', 'customize_billing_fields', 10000, 1 );
    function customize_billing_fields( $billing_fields ) {
        $billing_fields['billing_state']['placeholder'] = __('State', 'woocommerce');
        $billing_fields['billing_postcode']['placeholder'] = __('Postcode', 'woocommerce');
    
        return $billing_fields;
    }
    
    add_filter('woocommerce_shipping_fields', 'customize_shipping_fields', 10000, 1 );
    function customize_shipping_fields( $shipping_fields ) {
        $shipping_fields['shipping_state']['placeholder'] = __('State', 'woocommerce');
        $shipping_fields['shipping_postcode']['placeholder'] = __('Postcode', 'woocommerce');
    
        return $shipping_fields;
    }
    

    All code goes in function.php file of your active child theme (or active theme).

    I hope that one of those will work. Without a third party plugin each of those codes works perfectly.