Designer Overview

The designer is the visual form editor. This page describes its parts and basic workflow.

Screen Layout

The designer opens in the Form Configuration window via the Form Settings button in the form's top toolbar (see Quick Start). The window has three bands.

Window Header

Top Designer Toolbar

Tabs are on the left, tools are on the right.

TabPurposeDetails
LayoutTabs, sections, fields, and widgetsForm Layout
PreviewInteractive preview of the form in New, Edit, and Display modesPreview
RulesConditional behavior (rule count is shown in the badge)Rules & Conditions
List ActionsCustom buttons in the list command bar and item context menu, confirmation dialog textsButtons and List Actions
Bar & ButtonsLive preview of the command bar, system and custom buttonsBar & Custom Buttons
ScriptsCustom JavaScript (must be enabled on the tenant)JavaScript Scripts
Translations (i18n)Form texts in additional languagesTranslations & Multilingual
AI AssistantPrompt for an external AI and safe application of its response (Pro license)AI Assistant
JSONDirect editing of the configurationRaw JSON

Tools on the right, from left to right:

Bottom Bar

Status text (Unsaved changes · ready to save, Configuration is saved and valid, or Cannot save · N validation errors) and the Close and Save form (Ctrl+S) buttons. Closing with unsaved changes prompts with Back to editor, Discard changes, or Save and close. Save form alone does not close the builder: a Configuration saved. message appears (and fades after a few seconds) and the form behind the window re-renders with the new configuration. On failure an error message is shown and the window stays open.

Full designer window on the Layout tab: header, top toolbar with tabs and tools, palette on the left, canvas in the center, inspector on the right, and status bar at the bottom

Tabs and buttons are displayed in the designer language (cs, en, de, sk). This documentation uses English labels.

Field and Widget Palette

The palette is the left-hand panel on the Layout tab.

Palette with Fields and Widgets tabs, search box, and Unplaced only and System toggles. At least one field is marked as already placed

Creating a Column

You can create a new list column directly from the palette without opening SharePoint list settings. The Create column button is above the search box on the Fields tab. It is available only to users with the Manage Lists permission (list owner or administrator); other users do not see the button and nothing is created for them.

Field Inspector

Click a field, widget, section, or tab to display its properties on the right. For fields and widgets, the inspector has these sections (the exact set depends on the type):

The meaning of each type's options is described in Field Types & Properties.

Text field inspector: Custom label, Description and help, Width in section, Default behavior toggles, and Format validation (Regex) section

Undo and Redo

Configuration Warnings

The yellow N warnings badge in the toolbar opens a list of issues that do not block saving but are worth fixing:

Unlike warnings, validation errors show a red banner Configuration contains validation errors and status text Cannot save. Until fixed, the Save form button is disabled and export is blocked. Typical causes: a field appears more than once in the layout, a rule references a non-existent field or function, or the blockSave action is used in a rule with a trigger other than On save.

Rules referencing removed fields are not deleted: they are marked invalid, skipped at runtime, and preserved so you can repair them. Before deleting a tab, section, field, or rule, the designer shows an impact dialog listing affected rules and scripts.

Open warnings list from the N warnings badge in the top toolbar

Preview and Split Preview

Layout tab with Live preview enabled: canvas on the left and Edit mode form preview on the right

Import, Export, and Restore

All three commands are in the More options (three dots) menu in the top toolbar.

On every save, the app also keeps the last 10 versions of the configuration in the Site Assets library under FormCustomizer/<List ID>/history. The designer does not yet offer direct UI restore for these; a site owner can copy them manually.

Export and import is the fastest way to move a form between lists and environments (dev, test, production). After importing, check any fields that had to be removed.

Designer Language Switcher

At the far right of the top toolbar are language codes (for example, CS, EN). The switcher offers the form's default language and enabled languages. It changes two things:

For details, see Editing in the Designer in Another Language.

Concurrent Configuration Edit Conflict

Every configuration save receives a new revision. If another administrator saved the form in the meantime, the designer rejects the save and displays the Configuration version conflict detected dialog with the author and timestamp of the latest change. Options:

Licensing in the Designer

The designer header displays the customer name from the license key. After update entitlement (upd) expires, the designer runs in Community mode with a prompt to renew maintenance, while published forms continue working without a watermark. Details, revocation, and entering a key: Licensing. Scripts are governed by the tenant script policy.

Raw JSON

The JSON tab displays the entire configuration as text that you can edit directly. Format JSON pretty-prints the text, Apply JSON applies the changes (only when valid), and Revert changes discards them. Syntax and schema errors appear in the JSON Errors list.

The designer also compares field data types with the list columns. Fields without fieldType (for example, a manually inserted currency field) are automatically filled in from the column type on Apply JSON, import, and AI suggestions, and the designer reports how many types it filled. A type incompatible with the column (such as Yes/No on a number column) is reported as a warning below the editor and in the top toolbar warnings; it is only a warning and the JSON can still be applied. Missing types are also filled in memory when loading the form, so features tied to numeric fields (repeating table totals, KPI) work even with older configurations.

Direct editing bypasses designer checks. Applying JSON writes to the working configuration and reaches SharePoint only after saving, though it can be undone with Undo. If a saved configuration has an error, the designer opens on this tab for repair; see FAQ.

The configuration structure is documented in the developer section: Configuration Schema.