We’re on vacation till 19 June. Support replies might be delayed than usual. Thank you for being patient and considerate.

Up to 65% off Early Bird LTD ➜ GutenKit – Gutenberg Page Builder Blocks!


Checkout Additional Field

Checkout Additional Field allows you to add a custom form field to the checkout page. You can add a custom form field to the billing form, shipping form, and Additional form widget.

This module is useful in case you are looking to add an extra custom form field to your check-out page in addition to the existing ones that WooCommerce provides. Moreover, you also have to option to make the form field required/ not required depending on the information you want the customer to submit.

Step 1: Enable Checkout Additional Field Module #

You need to enable the module for it to activate. To enable the module

  • Go to: ShopEngine > Modules > Checkout Additional Field
  • Click on the Settings Icon
  • Turn on the Enable the module option
  • Save changes.
Enable checkout Additional Field

Note: You can also enable all the modules at the same time. Check out how you can turn on all the modules at once.

Step 2: Settings of Checkout Additional Field Module #

Let’s check how you can add, edit and delete form field items.

Add edit delete checkout additional field

Add: #

To add any form field + Add Item item and add the following field:

  • Label:  Give a label title here.
  • Type: Chose the type of field you want.
  • Name (Unique Key): Give a unique key. Make sure there is no space between, no special character. And always make sure you give a unique name for each field you create.
  • Placeholder: Write the text for the placeholder.
  • Required: Chose if you want to make this field required or not.
  • Position (After):  Chose the position of the field.
  • Custom CSS Class: You can add any custom CSS class here if you want to.

Now click on save changes to save the field form.

Add billing form input field list

Edit: #

To edit, the existing item clicks on the > option to make all the changes and click save changes to update. 

Delete: #

To delete any of the created forms click on the X icon and click on save changes.

Note: If you make any of the form field required, then you must add that relevant Checkout Form Widget to the Checkout template. And you can change the styling of the newly added form field from the related widget settings.

Here is the final preview of how Checkout Additional Field Module:

Final Preview of Checkout Additional Field Module

What are your feelings
Updated on August 31, 2022