Skip to main content

Define the Login Options

Zuora

Define the Login Options

The Login options allow you to define the fields for the following forms:

  • Verification Code: This is displayed when the authentication requires the user to log in using a password code
  • Enter Password: This is displayed when the email verification has identified the user as a customer
  • Forgot Password: This is displayed if the user selects the forgot password link
  • Reset Password: This is displayed if the user selects the reset password link

Note: If the One-time Password Code toggle in the Registration options is not selected, the Verification Code options are not displayed. For further information on the registration options, see the Define the Registration Options topic.

When you have finished defining these forms, select the Done button to return to the Add Frictionless Form screen.

Verification Code Fields

The available fields for the Verification Code form are as follows:

If you want to add custom text to your form, select the Add Custom Text button

The Text dialog box displays.

To define the custom text, complete the following steps:

  • Text

    This defines a text field.

    The following default Text fields can be defined:

    • A message with a code has been sent…
    • Enter the code in the box below

    These can be updated in the same way.

    To define the text, complete the following steps:

    1. Select the three dots at the end of the Text row
    2. Select Edit

      The Text dialog box displays.

    3. Enter the text you want to display in the text box

      Note: If you want to format the text, for example to include a heading or a list, use the formatting bar at the top of the text box.

    4. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes

    You can remove this field as follows:

    1. Select the three dots at the end of the Text row
    2. Select Delete

      The field is deleted immediately.

  • Email Address

    This displays a field in which the end user can enter their email address

    To edit the text displayed, complete the following steps:

    1. Select the three dots at the end of the row
    2. Select Edit

      The Enter Email Address dialog box displays.

      At the top of the Enter Email Address dialog box, you can see a representation of the email address field as it appears in your form.

    3. Enter the label you want to display above the email address field in your form in the Input Box Label Text text box
    4. Enter the text you want to display in the email address field in your form in the Placeholder Text text box
    5. Select the Save button to save your changes and return to the Email Address screen. Selecting the Cancel button displays the Email Address screen without saving any changes
  • Enter Code

    This defines the enter code field.

    To define the enter code field, complete the following steps:

    1. Select the three dots at the end of the row
    2. Select Edit

      The Enter Code dialog box displays.

      At the top of the Enter Code dialog box, you can see a representation of the enter code field as it appears in your form.

    3. Enter the label you want to display above the enter code field in your form in the Code Label Text text box. By default, this is pre-filled with Code
    4. Enter the text you want to display in the enter code field in your form in the Placeholder text box. By default, this is pre-filled with e.g. 350271
    5. Enter the text you want to display to allow the user to request that the verification code is sent again in the Resend Text text box. By default, this is pre-filled with Didn’t get a code?
    6. Enter the text you want to display when the text is sent in the Code Resent Message text box. By default, this is pre-filled with Resent!
    7. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes
    1. Enter the text you want to display in the text box

      Note: If you want to format the text, for example to include a heading or a list, use the formatting bar at the top of the text box.

    2. Select the Save button to save your changes and return to the Email Address screen. Selecting the Cancel button displays the Email Address screen without saving any changes

Enter Password Fields

The available fields for the Enter Password form are as follows:

  • Email Address

    This displays a field in which the end user can enter their email address

    To edit the text displayed, complete the following steps:

    1. Select the three dots at the end of the row
    2. Select Edit

      The Enter Email Address dialog box displays.

      At the top of the Enter Email Address dialog box, you can see a representation of the email address field as it appears in your form.

    3. Enter the label you want to display above the email address field in your form in the Input Box Label Text text box
    4. Enter the text you want to display in the email address field in your form in the Placeholder Text text box
    5. Select the Save button to save your changes and return to the Email Address screen. Selecting the Cancel button displays the Email Address screen without saving any changes
  • Password

    This defines the field that allows the end user to specify their password.

    To edit the text displayed, complete the following steps:

    1. Select the three dots at the end of the Password row
    2. Select Edit

      The Password dialog box displays.

      At the top of the Password dialog box, you can see a representation of the email address field as it appears in your form.

    3. Enter the label you want to display above the email address field in your form in the Password Input Label text box. By default, this is pre-filled with Password
    4. Enter the text you want to display in the password field in your form in the Password Input Placeholder text box
    5. Enter the text to display in the link, which allows the end user to display their password as it is entered, in the Show Text text box. By default, this is pre-filled with Show
    6. Enter the text to display in the link, which hides the password as it is entered, in the Hide Text text box. By default, this is pre-filled with Hide
    7. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes
  • Reset Password Link

    This defines the link that the end user can follow to reset their password.

    To edit the text displayed, complete the following steps:

    1. Select the three dots at the end of the Reset Password Link row
    2. Select Edit

      The Link dialog box displays.

      At the top of the Link dialog box, you can see a representation of the link text as it appears in your form.

    3. Enter the link text in the Resend Text text box. By default, this is pre-filled with Forgot Password?
    4. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes
  • Button (Submit)

    This defines the Submit button

    To define the text used on the button, complete the following steps:

    1. Select the three dots at the end of the row
    2. Select Edit

      The Button (Submit) dialog box displays.

      At the top of the Button (Submit) dialog box, you can see a representation of the button as it appears in your form.

    3. Update the text in the Button Text text box
    4. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes

If you want to add custom text to your form, select the Add Custom Text button

The Text dialog box displays.

To define the custom text, complete the following steps:

  1. Enter the text you want to display in the text box

    Note: If you want to format the text, for example to include a heading or a list, use the formatting bar at the top of the text box.

  2. Select the Save button to save your changes and return to the Email Address screen. Selecting the Cancel button displays the Email Address screen without saving any changes

Select the Done button to save your changes and return to the New Payment Form.

Forgot Password Field

The available fields for the Forgot Password form are as follows:

  • Text

    This defines a text field.

    The following default Text fields can be defined:

    • Reset your password
    • A message with a code was sent to…
    • Enter the code in the box below

    These can all be updated in the same way.

    To define a text field, complete the following steps:

    1. Select the three dots at the end of the Text row
    2. Select Edit

      The Text dialog box displays.

    3. Enter the text you want to display in the text box

      Note: If you want to format the text, for example to include a heading or a list, use the formatting bar at the top of the text box.

    4. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes

    You can remove this field as follows:

    1. Select the three dots at the end of the Text row
    2. Select Delete

      The field is deleted immediately.

  • Email Address

    This displays a field in which the end user can enter their email address

    To edit the text displayed, complete the following steps:

    1. Select the three dots at the end of the row
    2. Select Edit

      The Enter Email Address dialog box displays.

      At the top of the Enter Email Address dialog box, you can see a representation of the email address field as it appears in your form.

    3. Enter the label you want to display above the email address field in your form in the Input Box Label Text text box
    4. Enter the text you want to display in the email address field in your form in the Placeholder Text text box
    5. Select the Save button to save your changes and return to the Email Address screen. Selecting the Cancel button displays the Email Address screen without saving any changes
  • Enter Code

    This defines the enter code field.

    To define the enter code field, complete the following steps:

    1. Select the three dots at the end of the row
    2. Select Edit

      The Enter Code dialog box displays.

      At the top of the Enter Code dialog box, you can see a representation of the enter code field as it appears in your form.

    3. Enter the label you want to display above the enter code field in your form in the Code Label Text text box. By default, this is pre-filled with Code
    4. Enter the text you want to display in the enter code field in your form in the Placeholder text box. By default, this is pre-filled with e.g. 350271
    5. Enter the text you want to display to allow the user to request that the verification code is sent again in the Resend Text text box. By default, this is pre-filled with Didn’t get a code?
    6. Enter the text you want to display when the text is sent in the Code Resent Message text box. By default, this is pre-filled with Resent!
    7. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes
  • Divider

    This defines the divider used in your form.

    To define the divider, complete the following steps:

    1. Select the three dots at the end of the row
    2. Select Edit

      The Divider dialog box displays.

      At the top of the Divider dialog box, you can see a representation of the divider as it appears in your form.

    3. Update the text in the Divider Text text box
    4. By default, the Divider line checkbox is selected. This displays a line either side of your defined text. To remove the lines, deselect the Divider line checkbox
    5. Select whether to display or hide the divider from the Visibility radio buttons. The options are as follows:
      • Show
      • Hide
    6. Select the Save button to save your changes and return to the Email Address screen. Selecting the Cancel button displays the Email Address screen without saving any changes
  • Button (Continue)

    This displays the Continue button, which your end user can use to move to the next step in the form

    To define the text used on the button, complete the following steps:

    1. Select the three dots at the end of the row
    2. Select Edit

      The Button dialog box displays.

      At the top of the Button dialog box, you can see a representation of the button as it appears in your form.

    3. Update the text in the Button Text text box
    4. Select the Save button to save your changes and return to the Email Address screen. Selecting the Cancel button displays the Email Address screen without saving any changes

Reset Password Fields

The available fields for the Reset Password form are as follows:

  • Text

    This defines a text field.

    To define the text, complete the following steps:

    1. Select the three dots at the end of the Text row
    2. Select Edit

      The Text dialog box displays.

    3. Enter the text you want to display in the text box

      Note: If you want to format the text, for example to include a heading or a list, use the formatting bar at the top of the text box.

    4. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes

    You can remove this field as follows:

    1. Select the three dots at the end of the Text row
    2. Select Delete

      The field is deleted immediately.

  • Password

    This defines the field that allows the end user to specify their password.

    To edit the text displayed, complete the following steps:

    1. Select the three dots at the end of the Password row
    2. Select Edit

      The Password dialog box displays.

      At the top of the Password dialog box, you can see a representation of the email address field as it appears in your form.

    3. Enter the label you want to display above the email address field in your form in the Password Input Label text box. By default, this is pre-filled with Password
    4. Enter the text you want to display in the password field in your form in the Password Input Placeholder text box
    5. Enter the text to display in the link, which allows the end user to display their password as it is entered, in the Show Text text box. By default, this is pre-filled with Show
    6. Enter the text to display in the link, which hides the password as it is entered, in the Hide Text text box. By default, this is pre-filled with Hide
    7. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes
  • Button (Submit)

    This defines the Submit button

    To define the text used on the button, complete the following steps:

    1. Select the three dots at the end of the row
    2. Select Edit

      The Button (Submit) dialog box displays.

      At the top of the Button (Submit) dialog box, you can see a representation of the button as it appears in your form.

    3. Update the text in the Button Text text box
    4. Select the Save button to save your changes and return to the Login screen. Selecting the Cancel button displays the Login screen without saving any changes