Adding Fields to a Form

In the Form Designer:

To rename the form, click the pencil icon next to the name in the upper left corner of the canvas area.

To change the form properties:

1. Click on the form in the canvas near the title.
2. The details pane will appear on the right.
3. On the Basic tab, edit the Form Title and Description. Click the variable button to use variables in your description.
4. To change the form name, click the pencil icon near the form name in the toolbar.
5. To edit form settings, click on the form near the title in the canvas.
6. On the Basics tab you can:
   • Edit the Form Title and Description.
   • Under Responsive Layout, if you have created a custom layout that you wish to remain unchanged when viewed on a mobile or other small screen device, check the option to Disable automatic layout adjustment for small screens. Otherwise, the form will be automatically optimized for use on mobile devices.
7. Set the Maximum Width, in pixels, that main form will cover in the browser.
8. Set the Saved Page Orientationto either Portrait or Landscape. This controls the layout of the document created when saving a submitted form.
9. Under Pagination, select Enable Pagination to show the form on multiple pages.
   • Select Show submission actions on every page to display the action buttons you define on every page of the form. By default, actions are only displayed on the last page of a multi-page form.
   • Select Enforce validation on page progression to automatically validate data entered by the user before allowing them to continue to the next page. If the selected pagination style allows a user to skip a page, validation will not be enforced. To fully enforce validation, use the Progress bar pagination style.
   • Select Add page breaks to saved forms to include page breaks in saved forms.
   • Under Pagination Style, select the type of page navigation to use. Select Include previous/next buttons if desired.
   • Under Pages, add, rearrange, or remove the number of pages desired, and configure the Page Name, Previous Button text, or Next Button text.
10. Under Label Alignment, set where
    • If Left or Right alignment is selected above, select from a small, medium, or large Label Width space.
11. On the Rules tab you can view and create Field Rules, Lookup Rules, and configure Custom Error Messages.
12. All changes will be applied automatically to the canvas.

Searching for Form Fields

You can search across all pages of a form for specific fields. This may help in locating a field on a long form or a form with many pages.

To search for a field:

1. Click the magnifying glass in the upper right toolbar.
   
2. The right pane will display a search bar and any results once a search is completed. Enter a value to search on. You can search by field type, description, variable, or ID, and can use a partial value to return multiple items.
3. The results will be displayed as descriptive cards, containing details about the field.
4. Click on the card to highlight the field on the form. Click on the card's field type (in blue) to highlight the field on the form and open it's settings in the right pane. If a field is associated with rules or custom error messages, you can click the rule/error count to be taken directly to the rules tab for the field.

1. Click the form's title, then click Edit.
2. Edit the title and description. Click the variable button to use variables in your description.
3. Optional: Hide the form's title by clearing the Show form title checkbox.
4. When you are finished, click Done.

In the classic form designer, click the Form Settings button on the top right of the forms page to do the following:

• Name: Rename the form.
• Responsive layout: Enable or disable a responsive layout.

Note: By default, forms are set to be responsive, meaning the form will adjust its layout depending on the browser's width. Using a responsive design lets users easily view and fill out the form on mobile devices. If the browser is less than 640px, each field's label will move above the field. If the browser is greater than 640px but less than the form width you configured in the Form Settings, the label and field width will be re-sized to fit the browser.

Important: Custom CSS may interfere with a responsive design, so we recommend previewing responsive forms that have custom CSS styling to ensure the form re-sizes as desired. If your custom CSS styling is more important than having a responsive form, you may choose to disable responsiveness.

• Maximum width: Adjust the width of the entire form.
• Saved Page Orientation: Set the form to portrait or landscape orientation. This option only applies when printing, downloading, and saving the form. This does not affect how the form is displayed in the browser.
• Alignment: Align the field labels to the left, right, or top of the fields.
• Width: Adjust the width of the field labels that have been aligned to the left or right.

See a video on how to create multi-page forms.