Checkout Fields Usage Examples

• Order Comment Field
• Add notice, tooltip, and placeholder for the field
• Display Fields in Order Email
• Display Fields at Checkout Success Page
• Display Fields in Orders Grid
• Get Fields Values in Orders API

Order Comment Field

To add order comment field on checkout, follow below steps:

1. Go to Swissup > Checkout > Checkout Fields
2. Press Add New Field button
3. Fill Default Label
4. Select Store View where to show the field
5. In Catalog Input Type select Text Area
6. If required, fill other optional properties, such as Values Required, Sort Order and Default Value
7. Specify labels for other store views on Manage Labels tab if required
8. Press Save Field button
9. Go to checkout and check the field you created:

Add notice, tooltip, and placeholder for the field

You can specify a notice, tooltip, and placeholder for the field in the Advanced Field Properties section when creating or editing the field at Swissup > Checkout > Checkout Fields

Display Fields in Order Email

In order to display checkout fields in order emails, follow next steps:

1. Go to Marketing > Communications > Email Templates
2. Press Add New Template button
3. Select template, for example New Order for Guest, and press Load Template button
4. Give name for template in Template Name field

5. In Template Content place the following code where you want to show checkout fields:

   {{block class="Swissup\CheckoutFields\Block\Adminhtml\Order\View\Fields" area="frontend" template="Swissup_CheckoutFields::email/order/fields.phtml" order_id=$order_id}}
   

   if you want to display only specific fields, list comma-separated attribute codes in fields_to_show paramether:

   {{block class="Swissup\CheckoutFields\Block\Adminhtml\Order\View\Fields" area="frontend" template="Swissup_CheckoutFields::email/order/fields.phtml" order_id=$order_id fields_to_show="order_comment,favourite_products,delivery_date"}}
   

6. Press Save Template button
7. Go to Stores -> Configuration -> Sales > Sales Emails -> Order, select new template in New Order Confirmation Template for Guest and press Save Config
8. Check order email with checkout fields:

Display Fields at Checkout Success Page

Use module Checkout Success Page module to get custom checkout fields at success page.

1. Make sure Checkout Success page is enabled. Go to Stores > Configuration > Swissup Checkout > Success Page and check option ‘Enabled’ in ‘General’ section.
2. Go to section ‘Page Layout’. Drag Checkout Fields block from ‘Blocks available on Success Page’ and drop at ‘Layout of Success Page’ in place where you want to see checkout fields.
3. Save config or use ‘Save and Start Preview’ button to check how success page looks.

Display Fields in Orders Grid

To display checkout fields in orders grid, follow next steps:

1. Go to Swissup > Checkout Fields, edit the field and set Add to Column Options to Yes.
2. Go to Sales > Orders and select fields you want to display in Columns dropdown.

Get Fields Values in Orders API

Since 1.3.0 version checkout fields values can be accessed in API using orders and orders/{id} endpoints.