Welcome to the official documentation for Custom Fields Checkout Block for WooCommerce. This plugin lets you add unlimited custom fields to your WooCommerce checkout page — no coding required.
1. Requirements
- WordPress 5.8 or higher
- WooCommerce 6.0 or higher
- WooCommerce Checkout Block enabled on your checkout page
- PHP 7.4 or higher
- Tested up to WordPress 6.9.1
Note: This plugin works with the WooCommerce block-based checkout (Gutenberg). It does not apply to the classic shortcode-based checkout (
).
2. Installation
Option A — Install from WordPress Dashboard
- Go to Plugins > Add New in your WordPress admin.
- Search for Custom Fields Checkout Block for WooCommerce.
- Click Install Now, then click Activate.
Option B — Manual Upload
- Download the plugin
.zipfile. - Go to Plugins > Add New > Upload Plugin.
- Choose the
.zipfile and click Install Now. - Click Activate Plugin.
Option C — FTP Upload
- Extract the plugin
.zipfile on your computer. - Upload the extracted folder to
/wp-content/plugins/via FTP. - Go to Plugins in your WordPress admin and activate the plugin.
3. Getting Started
After activating the plugin:
- Go to WooCommerce > Custom Fields Checkout Block in your WordPress admin menu.
- You will see the plugin’s field management screen.
- Make sure the Enable Custom Fields toggle is turned ON.
- Click Add Field to create your first custom checkout field.
4. Adding a Custom Field
- Navigate to WooCommerce > Custom Fields Checkout Block.
- Click the Add Field button.
- Fill in the field settings:
- Label — the field name shown to customers (e.g. “Delivery Instructions”).
- Field Type — choose from Text, Email, URL, Date Picker (Pro), Select (Pro), or Checkbox (Pro).
- Location — where the field appears on checkout: Contact, Address, or Order.
- Required — toggle on if the customer must fill in this field before placing an order.
- Placeholder — optional hint text shown inside the field.
- Click Save. The field will immediately appear on your checkout page.
Editing a Field
- Find the field in the list on the admin screen.
- Click the Edit button next to it.
- Update the settings and click Save.
Deleting a Field
- Find the field in the list.
- Click the Delete button next to it.
- Confirm the deletion. This action cannot be undone.
5. Field Types
| Field Type | Description | Validation | Plan |
|---|---|---|---|
| Text | Single-line text input. Use for short custom answers (e.g. gift message). | None | Free |
| Email address input. Validates correct email format on submission. | Email format | Free | |
| URL | Website URL input. Validates correct URL format on submission. | URL format | Free |
| Date Picker | Calendar date picker (jQuery UI). Supports custom date formats. | Date format | Pro |
| Select | Dropdown list with predefined options for customers to choose from. | None | Pro |
| Checkbox | A single checkbox (e.g. opt-in for gift wrapping, newsletter, or terms). | None | Pro |
6. Field Locations
Choose where on the checkout page each field appears:
| Location | Where it Appears | Best Used For |
|---|---|---|
| Contact | Contact information section at the top of checkout. | Phone numbers, secondary email, social handles. |
| Address | Billing / shipping address section. | Apartment numbers, delivery notes, access codes. |
| Order | Order notes / additional information section. | Gift messages, special instructions, preferred delivery time. |
7. Field Settings Explained
Label
The text label displayed above the field on checkout. Keep it short and clear. Example: Gift Message, Preferred Delivery Date.
Placeholder
Optional hint text shown inside the field before the customer types anything. Supported on Text, Email, URL, Date Picker, and Select fields. Example: Enter your message here…
Required
When enabled, the customer cannot place an order without filling in this field. A validation error will appear if they try to submit without completing it.
Date Format (Date Picker — Pro)
Specifies the format in which the selected date is displayed and stored. Uses jQuery UI Datepicker format codes:
| Format Code | Example Output |
|---|---|
yy-mm-dd | 2025-12-31 |
mm/dd/yy | 12/31/2025 |
dd-mm-yy | 31-12-2025 |
d MM, yy | 31 December, 2025 |
8. Pro Features
The free version includes Text, Email, and URL fields. Upgrading to Pro unlocks three additional field types:
Date Picker (Pro)
- Adds a calendar popup on checkout using jQuery UI Datepicker.
- Fully customisable date format.
- Great for: preferred delivery dates, appointment booking, event dates.
Select / Dropdown (Pro)
- Define a list of options customers can choose from.
- Supports placeholder text (e.g. “— Please select —”).
- Great for: delivery time slots, gift wrap options, size preferences.
Checkbox (Pro)
- A single checkbox that customers can tick or leave unticked.
- Can be set as required (e.g. for accepting terms).
- Great for: newsletter opt-in, gift wrapping, age verification.
Upgrade to Pro: codesmade.com/store/custom-fields-checkout-block-for-woocommerce
9. Viewing Field Values in Orders
In WooCommerce Admin
- Go to WooCommerce > Orders.
- Open any order placed after your custom fields were set up.
- Scroll down to the Order Details or Additional Information section.
- All custom field values submitted by the customer will be displayed there.
In Order Emails
Custom field values are automatically included in WooCommerce order emails sent to both the customer and the store admin. No additional configuration is needed.
10. Frequently Asked Questions
Can I add more than one custom field?
Yes — you can add unlimited custom fields. There is no cap on the number of fields.
Will the fields work with the classic WooCommerce checkout?
No. This plugin is designed specifically for the WooCommerce Checkout Block (block-based checkout). It does not support the classic shortcode checkout
How do I check if I am using the Checkout Block?
Go to Pages > Checkout in your WordPress admin and edit the page. If you see a block labelled Checkout in the editor, you are using the block-based checkout. If you see the shortcode
Can I reorder the custom fields?
Field order follows the sequence they were created. To change the order, delete and re-create them in the desired sequence.
Are the fields validated before the order is placed?
Yes. Required fields must be filled in before submission. Email fields validate correct email format. URL fields validate correct URL format. Date Picker fields validate the selected date format.
Are custom field values saved to the order permanently?
Yes. All submitted values are saved as order meta data and will persist with the order in WooCommerce.
What happens to old field values if I delete a field?
Deleting a field removes it from the checkout form going forward. Previously saved values on existing orders are retained in the database and remain visible in those orders.
Is this plugin GDPR compliant?
The plugin stores data entered by customers as part of their order. It is your responsibility as the store owner to disclose what data you collect in your Privacy Policy. WooCommerce’s built-in personal data tools can be used to export or erase customer data, including custom field values.
Does the plugin work with multilingual plugins (WPML, Polylang)?
The plugin uses standard WordPress translation functions. Field labels can be translated using WPML String Translation or Polylang.
Where can I find the full documentation online?
Full documentation is available at: codesmade.com/custom-fields-checkout-block-for-woocommerce-documentation
11. Support & Contact
| Documentation | View Full Documentation |
| Contact & Support | codesmade.com/contact-us |
| WordPress.org Forum | Support Forum |
| Upgrade to Pro | codesmade.com/store |