Search code examples
phpwordpresswoocommerceplaceholderaccount

Customizing placehorlder in billing/shipping forms


I am using woocommerce_checkout_fields filter for customizing the placeholders in WooCommerce checkout page.

  add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
  function custom_override_checkout_fields( $fields ) {
    $fields['billing']['billing_first_name']['placeholder'] = 'Name';
    $fields['billing']['billing_last_name']['placeholder'] = 'Surname';
    $fields['billing']['billing_email']['placeholder'] = 'Email';
    $fields['billing']['billing_company']['placeholder'] = 'Company Name';
    $fields['billing']['billing_phone']['placeholder'] = 'Phone';
    $fields['billing']['billing_postcode']['placeholder'] = 'Zip Code';
    $fields['billing']['billing_city']['placeholder'] = 'City';

    $fields['shipping']['shipping_first_name']['placeholder'] = 'Name';
    $fields['shipping']['shipping_last_name']['placeholder'] = 'Surname';
    $fields['shipping']['shipping_city']['placeholder'] = 'City';
    $fields['shipping']['shipping_postcode']['placeholder'] = 'Zip Code';
    return $fields;
  }

This work fine only for checkout page form.

How to customize 'placeholders' in all shipping and billing forms?

Thanks.


Solution

  • If you mean in My account pages for Billing and Shipping form, the only filter hook (that I know) that could do the trick is:

    add_filter( 'woocommerce_form_field_args', 'custom_form_field_args', 10, 3 );
    function custom_form_field_args( $args, $key, $value ) { 
        // your code 
        return $args;
    };
    

    It is located in wc-template-functions.php on line 1734, triggered by woocommerce_form_field() function in woocommerce templates under my_account subfolder, form-edit-address.php file (displaying the form fields) .


    This are the default $args you can use to target the changes you want to do inside your filter function:

    $defaults = array(
        'type'              => 'text',
        'label'             => '',
        'description'       => '',
        'placeholder'       => '',
        'maxlength'         => false,
        'required'          => false,
        'autocomplete'      => false,
        'id'                => $key,
        'class'             => array(),
        'label_class'       => array(),
        'input_class'       => array(),
        'return'            => false,
        'options'           => array(),
        'custom_attributes' => array(),
        'validate'          => array(),
        'default'           => '',
    );
    

    NOTE: With some changes made by Stone it's working. (see the comment).

    USE:
    You could use 'placeholder' this way to target each placeholder you need to change:

    if ( $args['id'] == 'your_slug1' ) {
        $args['placeholder'] = 'your_new_placeholder1';
    } elseif ( $args['id'] == 'your_slug2' ) {
        $args['placeholder'] = 'your_new_placeholder2';
    } // elseif … and go on
    

    The placeholders are generally the same for billing and shipping address… So your code will be like:

    add_filter( 'woocommerce_form_field_args', 'custom_form_field_args', 10, 3 );
    function custom_form_field_args( $args, $key, $value ) { 
        if ( $args['id'] == 'your_slug1' ) {
            $args['placeholder'] = 'your_new_placeholder1';
        } elseif ( $args['id'] == 'your_slug2' ) {
            $args['placeholder'] = 'your_new_placeholder2';
        } // elseif … and go on 
    
        return $args;
    };