Working with the form editor
The form editor allows you to add or edit the layout and items of your form. The editor consists of four main sections: the top menu, the left pane, the editing area, and the right pane.
Top menu
When building your forms, you can switch between the different modes in the top menu and use the available options. The top menu is always visible whichever mode you are in. The following table lists the modes and other available buttons:
|
Name |
Description |
|---|---|
|
Edit |
Default mode when you open the editor. The Edit mode allows you to edit and customize the structure and items on your form. |
|
Comments |
Comments mode lets you add comments to a form design and collaborate with team members. |
|
Preview |
Preview mode lets you see what your form looks like on mobile devices, tablets, or desktops. |
|
Versions |
Versions mode opens a pane with a list of saved drafts of your forms. You can select a draft and load it to revert your form to that version. |
|
Settings |
Lets you edit the form name, choose a webhook, choose a submit action, and add a fail message. |
|
Logic |
Add conditional logic to your form. |
|
Draft / Inactive / Active |
Shows the status of the form in the editor. |
|
Save & exit |
Lets you to save your design. Next to the Save & exit button, click |
|
Versions saved |
Indicates when your design was last saved. |
|
|
Expands or collapses the left pane. Collapsing increases your workspace to edit your form. |
|
Undo |
Allows you to undo changes you have made to your form design. |
|
Redo |
Allows you to redo changes to your form design that you have previously undone. |
|
|
Desktop view. The default view of the designer that allows you to edit the desktop version of your form. |
|
|
Mobile view. Allows you to edit the mobile version of your form, without affecting the desktop version. |
|
Load template |
Opens the Templates library so you can use a template to get started on a new design. |
|
Clear design |
Clears the design of your form so you can start from scratch. |
|
Helper grid |
Shows a grid in the editing area indicating where you can add layouts and items and lets you add them directly in the editing area. |
|
Add page |
Adds a new page as a copy of the page above. |
Left pane
By default, the left pane is displayed in the form editor. It consists of three separate tabs for layouts, items, and options. You can use the left pane to add or remove items, edit the layout, or customize the general styling of your forms.
Editing area
The editing area is the main workspace in the form editor where you can edit and customize the layouts and items on your forms, preview your forms on different devices, or add comments for collaboration.
When you're designing your form, you can click the zoom icons in the lower-left corner of the editing area to zoom in or out, or reset your view.
Right pane
The right pane is displayed in the form editor when you click an item or a layout in the editing area. This pane contains the settings you can use to customize an item or a layout. You can close the right pane at any time by clicking 
. This can be useful when you need to increase your workspace to edit your form.