Customer form in the Order In Store

Default customer form

Default fields

By default, when the catalogue is activated, a standard form is proposed with the following fields:

This is what the default customer form looks like:

Specific configurations on the default form

• Invert the position of the first and last names: so that the first name appears first and the last name second, you need to add the configuration "customer.invert_names" : true in the Configuration > Store App > Pages > Catalog > Specific settings page in the Options section.

  {
      "customer": {
          "invert_names": true
      }
  }

• Change the list of countries:

The default form proposes the following countries: France, Belgium, Germany, Italy, Luxembourg, Spain, Switzerland, United Kingdom. An override can be made per sales channel using the configuration "countries.{sales_channel}.{list of countries}" in the Configuration > Store App > Pages > Catalog > Specific settings page in the Options section.

Country codes must be in ISO-3166 format. Logos and translations will add themselves in the Store App.

{
    "countries": {
        "sc_ois_1": [
            "FR",
            "CH"
            "GB"
        ]
    }
}

Add custom fields

You can take personnalisation a step further by adding custom fields to the customer form. To do this, add the required fields to the configuration customer.custom_fields.{sales_channel}[{custom_fields_structure}] in the Configuration > Store App > Pages > Catalog > Specific settings page in the Options section.

If the fields added are to be applied to all the project's sales channels, then the field "_ALL_" must be given in the {sales_channel} part.

Here is a configuration applied to all the sales channels with ... being the structure of the custom fields that we will see below.

{
    "customer": {
        "custom_fields": {
            "_ALL_": [
                {
                  ...
                }
            ]
        }
    }
}

Custom fields structure

Inside the {sales_channel} entity ( or "_ALL_") there is an array of objects. Each object corresponds to a custom field to be added to the form. Here is the configuration to be entered for each custom field.

Field	Type	Mandatory	Description
name	string	Yes	This key is used to give the identifier of the field. This id must match with parameters used in POST /customers request or PATCH /customers/<id>  Allowed values Contact fields: title, first_name, last_name, phone_number, email, company_name, mobile_number Address fields: address_1, address_2, address_3, city, zip_code, country Custom fields: information.{custom_field}, external_id
target	string	No	Indicates whether the field should be saved in the customer structure or the address structure. By default, customer is applied. Only used for information.{custom_field} and external_id names, the others are automatically redirected to the right structure.  Allowed values customer address
type	string	No	Type of the field. By default, the text type is used.  Allowed values text - returns a string email - returns a string tel- returns a string password - returns a string flip-switch - returns a boolean list - returns a string or an array of string depending on the ‘multiple’ value If the field type is a list, then other fields will need to be configured. See below.
required	boolean	No	Indicates whether the field is mandatory or not. By default, custom fields are optional.
position_after	string	No	This key defines the name of the form element to which it must be placed after. Please note, the form element must be in the default form or declared before in the same form. It it also possible to place the element on the top of the form with the value :first. If multiple elements are placed in first position, they will be placed in the order in which they are configured. If not defined, the element form will be placed at the bottom of the form.  Examples If I want my field to appear after the country field of the default form : "position_after": "country" If I want my field to appear at the top of the form : "position_after": ":first" If I want my field to appear at the bottom of the form, I leave it blank.
validation	object	No	Enables to add custom validation to the field, which will be checked when the create button is clicked.  Allowed values These 3 types of validation can be configured alone or together. min_characters (int) - minimum number of characters required max_characters (int) - maximum number of characters required regex (string) - Custom regular expression used to verify the field. More information Here. error_translation_key (string) - Overrides the default translation key of the error message with a custom one if the regex is invalid. The error_translation_key specified here must then be translated with the pattern form.validation.{error_translation_key} from the Configuration > Store App > Translations page. Regexes with ‘\’ must escape by doubling it "\\"  Examples Require a 5-digit postcode "validation": { "min_characters": 5, "max_characters": 5 } Use a custom validation for UK postcode and add a custom message if the field is invalid "validation": { "regex": "^([a-zA-Z]){1}([0-9][0-9]|[0-9]|[a-zA-Z][0-9][a-zA-Z]|[a-zAZ][0-9][0-9]|[a-zAZ][0-9]|[0-9][a-zAZ]){1}([ ])*([0-9][a-zA-z][a-zA-z]){1}$", "error_translation_key": "UK_postcode_error_message" } And then translate the key form.validation.UK_postcode_error_message in the Configuration > Store App > Translations page.

In case of lists

If the type of field added is a list, then additional configurations must be added inside the structure.

"options": [
    "MR",
    "MRS"
],

Examples

Change classic fields

Request entries

• Regarding the address:

  • address_1 - sent in the customer.addresses.[0].lines.[0] field of the POST /customers query

  • address_2 - sent in the customer.addresses.[0].lines.[1] field of the POST /customers query

  • city - sent in the customer.addresses.[0].city field of the POST /customers query

  • zip_code - sent in the customer.addresses.[0].zip_code field of the POST /customers query

  • country - sent in the customer.addresses.[0].regions.country.code field of the POST /customers query

• Regarding the contact - sent in the customer.addresses.[0].contact AND customer.contact fields of the POST /customers query

  • title

  • first_name

  • last_name

  • phone_number

  • email

  • company_name

  • mobile_number

• Regarding custom information

  • information.{custom_field} sent in the customer.addresses.[0].information field if target = address / sent in the customer.contact field if target = address

  • external_id sent in the customer.external_id field. The target need to be set as customer.

Please note, the label of the field will be translated based on the translation key crm.<name>.

External CRM

External CRM may raised error (exemple email adress/phone number already used).
If so, project interface MUST return a 409 error including:

• field that is the field related to the conflit. Value MUST be email or phone_number

• message which is the error message to display in the interface

The error message will be display on the form.