Custom Checkout Fields
Add, validate, and manage custom input fields on your checkout, from simple text inputs to multilingual and sensitive fields.
Custom checkout fields overview
What custom checkout fields are and how to add them to your checkout.
Add a date picker field to the checkout
How to add a date picker field to the checkout to collect a date such as a preferred delivery date.
Add a dropdown with an "other" text option
How to add a checkout dropdown that shows a text box when the customer selects Other.
Add a gift wrapping checkbox to the checkout
How to add a gift wrapping checkbox or other add on item to the checkout.
Add custom fields to your checkout
How to add custom text, dropdown, radio, and checkbox fields to your checkout using HTML.
Hide sensitive custom field data from receipts and emails
How to use the h: field name prefix to keep sensitive custom checkout field data out of emails.
Keep custom field values when the checkout re-renders
How to to preserve custom checkout field values when the checkout page re-renders.
Pass custom field data to custom shipping code
How to pass a custom checkout field's value into your custom shipping code using a data attribute.
Populate custom checkout field options from an endpoint
How to fill select, radio, or checkbox options on the checkout from an endpoint on your site.
Pre-populate custom checkout fields
How to prepopulate a custom checkout field's value using a hidden session attribute and Twig.
Set up multilingual custom checkout fields
How to translate custom checkout field labels and descriptions for stores using multiple template set languages.