customerstalking

Magento 2 Customer Attribute System

We develop magento 2 extensions, and we also help some customers to understand magento 2. As the most of developers knew, the community edition didn’t support an attribute system for customer or address. But our customers want to have customized fields for frontend forms,  we said that they need some coders to customize. If each time when they need, they have to hire someone, that’s not comfortable.

In April, we decided to develop an extension to help our customers and this was first magento 2 extension to manage customer or address attributes. In the current time, this extension was upgraded three times. We implemented both popular features and unique features. Our challenge is the change of magento 2 version. Magento 2 core team changed UI, business logic, api when they upgraded product. Hence, we developed this extension for each version (2.0.x and 2.1.x).

Basic features are very essential:

  • Show list of attributes (Customer & Address)
  • Attribute Filter
  • Create attribute “Text Field”
  • Create attribute “Textarea ”
  • Create attribute “Date”
  • Create attribute “Yes/no”
  • Create attribute “Dropdown”
  • Select input validation, support 6 types: Decimal, Integer, Email, Url, Letters, Letters (a-z, A-Z) or Numbers (0-9)
  • Show attribute on customer data grid
  • Show attribute on customer filter options.
  • Support label for attribute in multiple store: User can change frontend label of attribute for each store
  • Allow attribute to show on customer register page and account edit page
  • Allow attribute to show on address create page and address edit page
  • Able to change datetime format of attribute.
  • Able to change header text of additional information panel.
  • User can add attribute to customer address templates.
  • Able to change entity type of attribute, customer => address and vice versa.

We upgraded this product to version 2.3.0, support an advanced feature, that is “attribute relation” for frontend. This feature supports only user-defined attributes (custom attributes). In case, your store want some attributes of customer depend on other. For example: if customer is a manager of company, they need to input linkedin profile.

User can create many relations, and apply to:

  • Customer registration form
  • Customer edit form
  • Address registration form
  • Address edit form
  • Billing address form
  • Shipping address form

User also decide whether or not “attribute relation” will be apply to fronend forms. All relations are validated before create to avoid deadlock (infinity loop), for example: Attribute A depends on B with relation 1, Attribute B depends on A with relation 2. Both 1 and 2 apply to registration form.

  1. Create an attribute

Firstly, you need to input basic information about attribute. With “required” checkbox, this is special case, when this is checked, the attribute is required to input in database and on frontend. If you don’t allow this attribute to appear on frontend form, customer can’t complete input process. The system will throw an error message on screen. So, you should enable to show on frontend for required fields.

basic-info

validation

User can select one of six built-in validation types. User also decide whether this attribute appear on table or filter options. However, the system need to reindex and refresh cache. Mangento 2 supports a schedule job to do that, if you are not a technical person, you can request support from host provider (or an it man).

“Manage labels” section allows user to input attribute frontend label for multi stores.

labels

“Storefront properties” is the last section, this helps user to decide where attribute is appeared. If user selects address forms, the system understand that it’s an address attribute, and else if user selects customer forms, it’s  a customer attribute. This process is automatically. In most cases, you can select yes for all options if you don’t understand what is this form. “Sort order” field is very important, this will affect to what position the attribute show on frontend. You should not use default number (zero).

selected-form

sort-order-field

attribute-table

After saved attribute, the system will need to refresh cache or reindex. The attribute appears on the data table and user can search, sort, or filter data.

filter-data

That is about attribute management. The remain content is about relation. This is advanced feature. To create an relation, we need to do three steps:

  1. Select an entity type: Customer or Address

select-entity-type-for-relation

2. Select attribute: only attributes which are “select/dropdown” type is accepted. User can see text format “attribute code :  frontend label”

select-attribute

3. Input needed information

relation-final-step

And a new relation created successfully. All relations display on data table.

relation-data-table

After all steps, the result show on frontend forms. There are some screen shots for demo purpose.

  1. Customer Registration Form

Before

create-account-before-select

After select “developer”

 create-account-after-select

“Main skill” has sort order 0, “Professional” has sort order higher, that’s why this screen as you see.

2. Address forms

Before

shipping-form

After select US (In this case, “country” is a custom attribute).

shipping-form-after

3. Billing form: Add new billing address

billing-form

This module also supports user to change some settings:

  • Header title for customer form
  • Header title for address form
  • Enable/disable attribute relation feature for customer
  • Enable/disable attribute relation feature for address

customer-attribute-configuration

To install extension:

  • Copy source folder to your {magento 2 root} folder.
  • upgrade and install new module: bin/magento setup:upgrade
  • Deploy resource: bin/mageno setup:static-content:deploy

When you change evironment mode from developer to production: bin/magento deploy:mode:set production, if you get an error, please delete var/di, var/cache/ and var/generation.

If this extension is useful for you. You want to buy it. Please visit our official website.

BUY THIS EXTENSION

REVIEW THIS EXTENSION

Leave a Reply

Your email address will not be published. Required fields are marked *