Magento 2 Order Attributes

Magento 2 Order Attributes module allows the admin to enable the extra fields as an order attribute on the different positions during the checkout of an order.

It helps the admin to collect order-related data from a customer in a more flexible way. Even, the admin can use the different types of fields to collect the data from a customer with the help of Magento 2 Order Attributes.

Watch the video tutorial below to understand the extension workflow:

• Admin can add additional fields during the checkout of an order to collect the order-related data from a customer.
• The admin can use the Text Field, Text Area, Date, Page Builder, Yes/No, Multiple Select, Static Block, Dropdown, HTML, and Attachment as input attribute fields for the customers.
• The admin can select the customer groups that can view the order attributes.
• The admin may use the static blocks and HTML as a custom order attribute to view the checkout position.
• As per their needs, the admin can create and display many order attributes.
• The admin can also configure the module for the advanced attribute properties.
• The admin may also use the input validation feature to evaluate a customer’s input based on verification values.
• Admin can also allow the option to display order attributes in the view of admin order.
• Based on the various store views, the admin can decide on the labels.
• The admin can also decide the position of the order attributes during the checkout.
• The customer can use the order attribute if they want to add additional information along with the order.
• Magento 2 Order Attributes module supports multi-address checkout.

Customers will get a zip folder and they have to extract the contents of this zip folder on their system. The extracted folder has an src folder, inside the src folder there will be an app folder.

The admin needs to transfer this app folder into the Magento 2 (Adobe Commerce) root directory on the server.

After the successful installation of Magento 2 Order Attributes Extension, Now run these commands in the Magento2 root directory:

First command –

php bin/magento setup:upgrade

Second Command –

php bin/magento setup:di:compile

Third Command –

php bin/magento setup:static-content:deploy

After running the commands, the cache needs to be flushed from Magento admin panel by navigating through->System->Cache management as shown below.

For multi-lingual support, the admin will navigate through Store > Configuration > General ->Locale Options and select the locale as German (the language into which the admin wants to translate store content).

For module translation, please navigate the following path in your system. app/code/Webkul/CustomOrderAttributes/i18n. Open the file named en_US.CSV for editing as shown in the below screenshot.

Once the file is for editing. Replace the words after the comma(,) on the right with the translated words.

After editing the CSV file, save it and then upload it to the same folder. Now the module translation is complete.

After the successful installation of the module, the admin can navigate to Order Attribute under the Manage Order Attribute Menu.

 By clicking on the “Order Attribute” the admin can view the already created order attributes, create new ones, and also can manage the existing ones.

Henceforth, the admin can click on the “Add New Attribute” to create the new attributes.

Attribute Properties –

Here, from the “Properties Menu,” the admin can fill in the required details to create a new order attribute. The admin can create the –

Default Label – The admin can give the default label name to the order attribute.

Attribute Code – The admin can name the attribute code for internal purposes.

Frontend Input Type –  Admin can select from the available Input Type to create the order attribute, it includes Text Field, Text Area, Date, Yes/No, Multiple Select, Dropdown, HTML, Static Block, and attachment.

Moreover, the admin can create the custom order attributes based on the available multiple options as mentioned.

Eg: The admin can create the custom order attribute based on the “Dropdown” option as shown in the image below –

The admin can give the default label for the custom order attribute, decide the attribute code, select the front-end input type, and select if the values are required or not.

Even, the admin can manage the options (values of the attributes), and manage the advance attribute properties as well.

Now, at the front end, when a customer visits the website, the custom-created order attribute will display.

Lots of options are available to create custom order attributes. The admin can also use the “Static Blocks” as an attribute type to display to the customers.

Then select the available CMS Block from the advanced attributes properties as shown in the image below –

Custom-created order attributes with Static Block can be seen at the front end –

Attachment Attribute Type:

The admin can also create the input type as an attachment.

After selecting the attribute as an attachment and entering other details, the admin can choose the allowed file types that can be added by the customers for the order.

Now, after configuring all other aspects for the order attribute and saving it, it appears in the section as set by the admin.

After placing the order, the order attachment is visible to the customer under the respective order history. The customer can download the attachment as well.

The order attachment is visible in the order confirmation mail as well.

Now back to the other options available –

Values Required – The admin has the choice if values are require or optional for the customers.

Default Values – The admin can enter the default value to show at the front end. And this value is editable for the customers.

Input Validation –Based on the input types, there are several input validations available. To validate the input type, the admin may use these values.

Validation only works with the “Text Field” attribute type.

Eg: If the admin has selected Frontend Input Type as a Text Field then the admin can validate the Input Values as Decimal Number, Integer Number, Email, URL, Letters, and Letters (a-z, A-Z) or Numbers (0-9) as shown in the image below –

Manage Labels –

The manages label menu option, the admin can decide the label titles of the created “Order Attribute” for the different store view as shown in the image below –

Storefront Properties –

Admin can select where the order attribute option should display to the customer at the front-end. There are multiple choices available and one of them can be chosen by the admin according to their needs.

The admin will find another field i.e. Map with Category where the admin can map attributes with the category.

Show on Storefront –  The admin here may set whether or not to show the attributes on the checkout page.

Show on Storefront Order View – If the enabled customer will be able to see this on the storefront order view page.

Sort Order – With the help of this admin can give the order of all those custom attributes like how it will display.

Position on Checkout – With the help of this admin can display the custom attributes wherever the admin wants on the page. 

Map with Category – In Storefront properties admin will find Map with Category option if enable, the order attributes are mapped with the categories, ie. attribute mapped with the respective categories will display for each product of that category.

If no category is mapp, attributes will display for all products.

Now, at the front-end, the customer can see the custom order attribute on the checkout position.

When a customer selects and adds the product to the cart, the custom order attribute option will display to the customer as configured by the admin.

Customers can add the shipping address, select the shipping method, and enter the email address in the custom order field.

After completing the order, the customer can also see the custom order attribute in their order history.

The order attributes are visible during multi-address checkout as well.

The admin can also view the order attribute from the admin dashboard by navigating to the Sales> Orders

Hence, the admin can also view the custom order attribute by clicking on the “View” order.

That’s all for the Magento 2 (Adobe Commerce) Order Attributes. Still, have any issues please email us at [email protected] else you can generate a ticket at https://webkul.uvdesk.com/en/

Explore the Adobe Commerce Cloud development service by Webkul. You may also browse other Magento 2 marketplace addons. Also our quality Magento 2 extensions.