fbpx

Description

When enabled, WooCommerce Checkout Custom Fields module lets you add custom fields to WooCommerce checkout page. This neat feature allows you to add more fields to your checkout page. Choose which section to add the custom field to (Billing / Shipping / Order notes / Account), and choose which type of information field you want to add – add a text field, text area, number, a date/time picker, a checkbox, select, radio, or a password, and give it a label or some text explaining what you want your customers to do.

Email Options

This section allows you to set if you want custom fields to be displayed in emails. Also here you can define how fields should be outputted.

WooCommerce Checkout Custom Fields - Admin Settings - Email Options

Add All Fields to Admin Emails
Enable this if you want all fields to be added to all emails to administrators.__ALG_REMOVE__
Default: yes
Add All Fields to Customers Emails
Enable this if you want all fields to be added to all emails to customers.__ALG_REMOVE__
Default: yes
Emails Fields Template: Before the fields
This option sets what should be outputted before the custom fields. For example try: <table>.__ALG_REMOVE__
Default: None
Emails Fields Template: Each field
This option sets how each field should be outputted. Replaced values: %label%, %value%. For example try: <tr><th>%label%</th><td>%value%</td></tr>__ALG_REMOVE__
Default: <p><strong>%label%:</strong> %value%</p>
Emails Fields Template: After the fields
This option sets what should be outputted after the custom fields. For example try: </table>.__ALG_REMOVE__
Default: None

Order Received Options

WooCommerce Checkout Custom Fields - Admin Settings - Order Received Options

Add All Fields to "Order Received" (i.e. "Thank You") and "View Order" Pages
__ALG_REMOVE__
Default: yes
"Order Received" Fields Template: Before the fields
__ALG_REMOVE__
Default: None
"Order Received" Fields Template: Each field
Replaced values: %label%, %value%.__ALG_REMOVE__
Default: <p><strong>%label%:</strong> %value%</p>
"Order Received" Fields Template: After the fields
__ALG_REMOVE__
Default: None

Custom Fields Number Option

Custom Fields Number
Sets the number of custom fields you want to add. Click "Save changes" after you change this number - new settings fields will appear.__ALG_REMOVE__
Default: 1

Field's Options

WooCommerce Checkout Custom Fields - Admin Settings - Field General Options

Enable/Disable
Enables the custom field.__ALG_REMOVE__
Default: no
Type
Possible values: Text; Textarea; Number; Checkbox; Datepicker; Weekpicker; Timepicker; Select; Radio; Password; Country; State; Email; Phone.__ALG_REMOVE__
Default: Text

WooCommerce Checkout Custom Fields

Required
Sets if the field is required to fill on checkout on not.__ALG_REMOVE__
Default: no
Label
Sets label for the field.__ALG_REMOVE__
Default: None
Placeholder
Sets placeholder for the field.__ALG_REMOVE__
Default: None
Priority (i.e. Order)
Here you can set the field's position inside the section. Lower number will move the field higher in the section.__ALG_REMOVE__
Default: None
Section
Possible values: Billing; Shipping; Order Notes; Account.__ALG_REMOVE__
Default: Billing
Class
HTML class. Possible values: Wide; First; Last.__ALG_REMOVE__
Default: Wide
Clear
CSS clear option.__ALG_REMOVE__
Default: yes
Customer Meta Fields
Check this if you want the field to be added to the customer meta fields.__ALG_REMOVE__
Default: yes

Select and Radio Field Type Options

This subsection allows you to set options for select and radio type fields.

WooCommerce Checkout Custom Fields - Admin Settings - Select and Radio Field Type Options

Select/Radio: Options
Set options for the field here. One option per line.__ALG_REMOVE__
Default: None
Select: Use select2 Library
Enable this if you want to use select2 library instead of standard HTML select input field.__ALG_REMOVE__
Default: no
select2: min input length
select2: Number of characters necessary to start a search. Ignored if set to zero.__ALG_REMOVE__
Default: 0
select2: max input length
select2: Maximum number of characters that can be entered for an input. Ignored if set to zero.__ALG_REMOVE__
Default: 0

Checkbox Field Type Options

This subsection allows you to set options for checkbox type fields.

WooCommerce Checkout Custom Fields - Admin Settings - Checkbox Field Type Options

Checkbox: Value for ON
__ALG_REMOVE__
Default: Yes
Checkbox: Value for OFF
__ALG_REMOVE__
Default: No
Checkbox: Default Value
Possible values: Not Checked; Checked.__ALG_REMOVE__
Default: Not Checked

Datepicker, Weekpicker and Timepicker Field Type Options

This subsection allows you to set options for datepicker, weekpicker and timepicker type fields.

WooCommerce Checkout Custom Fields - Admin Settings - Datepicker Weekpicker Timepicker Options

Datepicker/Weekpicker: Date Format
__ALG_REMOVE__
Default: None
Datepicker/Weekpicker: Min Date
Min date in days.__ALG_REMOVE__
Default: -365
Datepicker/Weekpicker: Max Date
Max date in days.__ALG_REMOVE__
Default: 365
Datepicker/Weekpicker: Add Year Selector
__ALG_REMOVE__
Default: no
Datepicker/Weekpicker: Year Selector: Year Range
The range of years displayed in the year drop-down.__ALG_REMOVE__
Default: c-10:c+10
Datepicker/Weekpicker: First Week Day
Possible values: Sunday; Monday; Tuesday; Wednesday; Thursday; Friday; Saturday.__ALG_REMOVE__
Default: Sunday
Timepicker: Time Format
__ALG_REMOVE__
Default: hh:mm p
Timepicker: Interval
Interval in minutes.__ALG_REMOVE__
Default: 15

Field Visibility Options

This subsection allows you to show or hide custom checkout field, depending on what's in cart.

WooCommerce Checkout Custom Fields - Admin Settings - Field Visibility Options

Exclude Categories
Hide this field if there is a product of selected category in cart.__ALG_REMOVE__
Default: None
Include Categories
Show this field only if there is a product of selected category in cart.__ALG_REMOVE__
Default: None
Exclude Products
Hide this field if there is a selected product in cart.__ALG_REMOVE__
Default: None
Include Products
Show this field only if there is a selected product in cart.__ALG_REMOVE__
Default: None
Min Cart Amount
Show this field only if cart total is at least this amount. Set zero to disable.__ALG_REMOVE__
Default: 0
Max Cart Amount
Show this field only if cart total is not more than this amount. Set zero to disable.__ALG_REMOVE__
Default: 0

Tips & Tricks

To add custom fields to Booster’s PDF invoices, you should use [wcj_order_checkout_field] shortcode, e.g.:
[wcj_order_checkout_field field_id="billing_wcj_checkout_field_1"]
You can use use Custom CSS Options (accessible through WooCommerce > Settings > Booster > EMAILS & MISC. > General). For example, to change default view of custom checkout radio buttons:

WooCommerce Checkout Custom Fields - Radio button
Custom CSS code for radio buttons restyling:

label.radio { display: inline !important; padding-left: 5px; }<br />
label.radio:after { content: ‘\A’; white-space: pre; }
Accessible through:
  • WooCommerce > Settings > Booster > Cart & Checkout > Checkout Custom Fields
Tested on WooCommerce 4.6.2 and WordPress 5.5.3
Plugin can be downloaded here. If there are any locked fields in the module, you will need to get Booster Plus to unlock them.