CODEWITHSUNDEEP
phpwordpresswoocommercefieldcheckout
Arun
Arun

Reputation: 1528

Add class for checkout form fields in Woocommerce

I want to add bootstrap form-control class to checkout form fields. According to woocommerce document

function custom_override_checkout_fields( $fields ) {
 $fields['order']['order_comments']['placeholder'] = 'My new placeholder';
 $fields['order']['order_comments']['label'] = 'My new label';
 return $fields;
}

Each field contains an array of properties:

type – type of field (text, textarea, password, select)
label – label for the input field
placeholder – placeholder for the input
class – class for the input
required – true or false, whether or not the field is require
clear – true or false, applies a clear fix to the field/label
label_class – class for the label element
options – for select boxes, array of options (key => value pairs)

So technically

$fields['order']['order_comments']['class'] = 'form-control';

should work, but i get a warning

implode(): Invalid arguments passed

and the class is not being applied. What am I doing wrong?

Upvotes: 2

Views: 4159

Answers (1)

LoicTheAztec
LoicTheAztec

Reputation: 254072

The explode() function is expecting an array, as checkout fields class property uses an array.

Now for bootstrap form-control class, that need to be on the field itself, you will use undocumented 'input_class' property in an array this way:

$fields['order']['order_comments']['input_class'] = array('form-control');

And it will work as you expect without errors (tested and works).

For 'class' property, Woocommerce uses the following classes:

  • form-row-first (half field with on the left)
  • form-row-last (half field with on the right)
  • form-row-wide (full field with)

Documentation: Customizing checkout fields using actions and filters

Upvotes: 1

Related Questions