How to Add Custom Field to Checkout in Magento 2?

In online shopping, the checkout stage is undoubtedly the most important one. This is where a user decides whether they wish to go through with the purchase or abandon their cart altogether. One might think that if a user reaches this stage, they’ll likely complete their purchase. However, it is not the case as evident by the below statistic.

The above statistic shows the average cart abandonment rate from 2006 to 2023. As you can see, the rate is still quite high. The below figure highlights the cart abandonment rate for specific categories and device type.

What do these figures indicate? They confirm a need to focus on the checkout stage and refine it to meet the customer expectations. One option is to keep the default Magento checkout fields. The second option is to replace the default fields with Magento 2 custom checkout fields.

Reasons for Cart Abandonment

The figure below highlights the top reasons for cart abandonment.

The above figure provides valuable insights into why your eCommerce store might be experiencing a high cart abandonment rate. However, not all these reasons are applicable to your store. Remember, cart abandonment reasons vary across niche and every store.

Why Focus on Magento 2 Add Custom Field to Checkout

The reason you for adding a custom field to checkout in Magento 2 is because it allows you to personalise the stage according to your store and target audience. A typical checkout page asks for customer’s name, billing & shipping address, shipping method and payment information.

The default Magento 2 platform offers a set of checkout fields, however not all merchants/customers would need the same fields all the time. They may in certain situations need to add custom fields to checkout to enrich their checkout page. This is where Magento 2 custom checkout fields come in handy.

Custom Checkout Fields

Magento 2 Custom Checkout Fields Extension: Easily add extra fields to checkout for gathering customer information.

Check it out! >

Solution to Magento 2 Add Custom Field to Checkout

Magento 2 custom checkout fields extension by FME Extensions offers an easy solution to design a Magento 2 custom checkout page. It allows store owners to add variety of unlimited custom fields to any checkout step effortlessly. You may be wondering why you need an extension, right?

Magento 2 does not allow you to customise the checkout field. Therefore, you have no option but to use an extension if you wish to add a custom field to checkout in Magento 2. The frontend demo below displays checkout fields including custom checkout fields after adding an item to cart and proceeding to checkout.

How to Use the Extension to Add Custom Field to Checkout?

• When you login to the Admin Panel, click FME Extensions -> Manage Fields
• Click Add New Attribute to add a new custom field to any checkout step.

• Under ‘Properties’ tab, provide custom field’s properties such as field type, default value etc. as shown below.

• Click Labels tab to manage custom fields Labels

• Under ‘Storefront Properties’ tab, you can enable or disable the custom field
• Choose the checkout step where you want to display the field
• Sort the field and use tooltip to provide more information about the field.

How to Add New Field in Magento 2 Shipping Address?

If you are searching for ‘Magento 2 add custom field to shipping address’, keep reading. As mentioned above, the extension lets merchants add custom fields to any checkout step. The following demo image shows how to do this. Just select ‘Shipping Address’ in the 'Checkout Step' dropdown and the field will be displayed in the shipping address form.

Example of custom field added at the 'Shipping Address' form

The following example shows the added custom checkout fields:

• Checkout field added at the ‘Shipping Address’ step.