You can decide where your add-on fields will appear on the checkout page – before or after the billing details section or before the order summary (default) – by adjusting the display setting:
On the same Customize tab, you can choose if you want to apply percentage adjustments based on the total or subtotal of the order.
To create a checkout add-on, go to WooCommerce > Checkout Add-Ons and click Add add-on.
You can now begin creating your checkout field! On the General tab, you can modify the following fields:
TYPE | DESCRIPTION | EXAMPLE USE CASE |
---|---|---|
Text | Customer can enter a short string of text. | Gift recipient’s name |
Text Area | Customer can enter a long string of text. | Gift messages |
Select | Customer can select one option from a drop-down menu. | Gift wrapping options |
Multiselect | Customer can select one, several, or all options from a drop-down menu. | Shipping and handling add-ons (e.g. Add Insurance, Add Rush Handling, etc.) |
Radio | Customer can select one option from a list of radio buttons. | Choosing whether or not the order contains a gift. |
Checkbox | Customers can select a single checkbox. | Adding a fixed-amount donation |
Multi-checkbox | Customer can select one, several, or all options from a list of checkboxes. | Gift wrapping add-ons (e.g. Add a bow, Add tissue paper, etc.) |
File | Customer can upload a file to include in their order, which you can access from your Media Library or when viewing the order. | Custom card cover |
Here’s an example of how each field appears on the checkout page:
You can set default values for all add-on types except “File”.
For the “Text” and “Text Area” add-on types, you can define the default on the General tab:
For all other eligible add-on types, you must navigate to the Options tab to set the default. For the “Multiselect” and “Multi-checkbox” add-on types, which let customers select more than one option, you can also set multiple defaults:
You can choose to associate fees or discounts in either fixed amounts or percentages for all add-on types.
To add a fee, enter the price adjustment as a positive value, such as 2.50
. To add a discount, enter the price adjustment as a negative value, such as -2.50
.
When setting the price adjustment as a percentage, the adjustment will be calculated based on the order’s subtotal.
For the “Text”, “Text Area”, and “File” add-on types, you can set the price adjustment on the General tab:
For all other add-on types, price adjustments can be set on the Options tab:
You can customise add-ons so they’ll only appear when certain conditions are met:
There are five attributes you can set for checkout add-ons:
Administrators can view all selected add-on fields in the Edit Order page:
Depending on the selected attributes, administrators can also view add-on fields from the Orders list.
The “File” add-on type lets customers upload a file with their order. When uploaded, files are given a unique suffix to prevent duplicate names. Uploaded files are available in your Media Library and the order itself.
If you have enabled the attribute to display the “File” add-on in the Orders list, you can also access files by selecting the link in the associated column.
The customer can view any selected/populated add-on fields and any associated price adjustments in the order details.