WordPress.org

1. rikardo85
   Member
   Posted 5 months ago #
   

   Hello,

   I would like to add a drop-down field to the billing address on the checkout page.

   I have found this code:

   // Hook in
   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 ) {
        $fields['billing']['billing_phone'] = array(
       'label'     => __('Phone', 'woocommerce'),
       'placeholder'   => _x('Phone', 'placeholder', 'woocommerce'),
       'required'  => false,
       'class'     => array('form-row-wide'),
       'clear'     => true
        );
   
        return $fields;
   }

   Which displays a basic text field.
   How can I display a field with drop down options? e.g. Title: Mr, Mrs etc

   Thanks

   http://wordpress.org/extend/plugins/woocommerce/

2. hexagoncircle
   Member
   Posted 4 months ago #
   

   I came across this, which seems to be the solution:

   $fields['billing']['billing_options'] = array(
       'label'       => __('Options', 'woocommerce'),
       'placeholder' => _x('', 'placeholder', 'woocommerce'),
       'required'    => false,
       'clear'       => false,
       'type'        => 'select',
       'options'     => array(
           'option_a' => __('option a', 'woocommerce' ),
           'option_b' => __('option b', 'woocommerce' )
           )
       );

   Now I'm wondering how you can add the chosen css styles to these new options to match the other drop downs... anyone??

3. terrytsang
   Member
   Posted 4 months ago #
   

   You can add class parameter to the array:
   

   $fields['billing']['billing_options'] = array(
       'label'       => __('Options', 'woocommerce'),
       'placeholder' => _x('', 'placeholder', 'woocommerce'),
       'required'    => false,
       'clear'       => false,
       'type'        => 'select',
       'class'       => array('own-css-name'),
       'options'     => array(
           'option_a' => __('option a', 'woocommerce' ),
           'option_b' => __('option b', 'woocommerce' )
           )
       );

4. rikardo85
   Member
   Posted 4 months ago #
   

   Thank you these work!

   Can I also ask, how do I place the drop down field at the top of the form?

   E.G the drop down field I have is title e.g. Mr, Mrs, Miss etc.
   I want this to appear before the first and surname.

   Thanks

5. hexagoncircle
   Member
   Posted 4 months ago #
   

   Thanks terrytsang, but unfortunately adding the chzn_select selector in there still didn't seem to work. Maybe I'm targeting the wrong selector?

   rikardo85, I'm not totally sure how to move the form elements around. That's a great question! I'm also wondering how to get these new custom fields to appear under the user's account so they can change them whenever they would like. Anybody know if there's a way to get these fields to filter into the user's account?

6. terrytsang
   Member
   Posted 4 months ago #
   

   Hi rikardo85, you can add the new drop down field at the top of the billing section by using my custom checkout extension.

7. terrytsang
   Member
   Posted 4 months ago #
   

   Hi hexagoncircle, please update my plugin version by downloading the latest zip file at the email download link. Thanks for the support!

Reply

You must log in to post.