Quick Start

Create your first custom list form in a few minutes: open the designer, adjust the layout, add a rule, and save.

Prerequisites

Without a valid license key, the Community edition runs: up to 2 tabs and 3 rules, and an unobtrusive product notice is shown below the form. The license is entered in the designer; see Entering a Key in the Designer.

Opening the Designer

  1. Open the list where the form is activated and click New, or open an existing item.
  2. In the top toolbar of the form, click Form Settings (the gear icon). This button is visible only to users whose permissions allow it; others do not see it.
  3. The Form Configuration window opens with the designer. On the left is the field palette, in the center is the layout canvas, and on the right is the inspector for the selected element.
Top toolbar of the list form with the Form Settings button (gear icon) to the right of the Print button

Until a list has a saved configuration, the form displays a single General tab with a Details section containing all editable list columns stacked vertically. You can start from this default layout.

Your First Form Step by Step

  1. Organize the form into tabs and sections. On the Layout tab, click + Tab for a new tab and + Add section for a new section. You can rename a tab or section in the inspector (click the tab or section header) or via the Tab options menu.
  2. Set the number of columns in a section. Click a section and in the inspector choose Default field grid in section, for example 2 columns. Fields will then be sized according to the grid.
  3. Add fields. Drag a field from the palette (Fields tab) into a section, or click + next to a field. The palette lists the list columns. A field already placed on the form is marked and cannot be added a second time.
  4. Customize a field. Click a field. In the inspector, change the Custom label, add a Description and help, or turn on Required. See all options in Designer Overview and Field Types & Properties.
  5. Check the preview. Switch to the Preview tab and test the New, Edit, and Display modes. To see the result continuously while working, turn on Live preview on the Layout tab.
  6. Save. Click Save form (or press Ctrl+S). The status bar at the bottom switches to Configuration is saved and valid and a short saved message appears at the top; the builder stays open.
Layout tab with a finished tab containing two sections, a selected field, and the inspector showing the Required toggle

On the first save by an owner, the designer locks the configuration storage (only owners and the designers group have write access). If the configuration was created before locking, a confirmation dialog Lock and save this configuration? appears with a summary of scripts, buttons, and rules. Review it and confirm. Details: Configuration Security.

Adding Your First Rule

  1. Open the Rules tab and add a new rule.
  2. Set a condition (for example, Status equals Approved) and an action (for example, Price – Read-only).
  3. Save the form and verify the rule in the preview.

All conditions, actions, and triggers are described on the Rules & Conditions page.

Rules tab with one rule displayed as a sentence: condition and action

Verifying in the Live Form

Close the designer with the Close button. The form immediately re-renders according to the saved configuration, and a brief notice Form configuration was saved to SharePoint appears above it. Then walk through the form as other users will see it: fill in required fields, try saving an empty form, and open an existing item in display mode. What an end user experiences in the form is described in Working with the Form.

Other users will see the new configuration the next time they open the form. If they still see the default layout, check FAQ.

Next Steps