The Form Editor
The form editor is where you add fields, set their options and style them. Open it from FormGlut › Add New, or click Edit on a form in All Forms.
Editor layout
Header
| Button | What it does |
|---|---|
| Back | Returns to All Forms. |
| Form title | The form’s name. Click to change it. |
| Editor / Settings / Entries | Switch between building the form, its settings and its entries. |
| Undo / Redo | Step back and forward through your changes. |
| Preview | Opens the form in a new tab. Save the form first. |
| Shortcode | Copies the form’s shortcode. Save the form first. |
| Save Form | Saves the form. It shows Save Form * when there are unsaved changes. |
Left panel
- Add Fields: every field type, grouped as General Fields, Advanced Fields, Container Layouts, Payment Fields and Security Fields. Type in the search box to find a field quickly.
- Field Options: the settings of the selected field (label, placeholder, required, validation, conditional logic and more).
- Style Options: the look of the selected field, or of the submit button.
Canvas
The canvas in the middle shows the form exactly as visitors will see it. Use the Desktop, Tablet and Mobile buttons above it to check how the form looks on smaller screens.
Working with fields
- Add a field: drag it from the left panel onto the canvas, or click it to add it at the end.
- Add after a field: click the round + under a field. The panel shows Adding after <field name>, and the next field you pick goes right there.
- Add to a column: click + inside a column. The panel shows Adding to column 2, for example.
- Select a field: click it to open its options.
- Move a field: drag it, or use Move up and Move down on the field’s toolbar.
- Duplicate or delete: use the toolbar that appears on the selected field.
Containers (column layouts) cannot be placed inside another container.
Keyboard shortcuts
| Shortcut | Action |
|---|---|
| Ctrl / Cmd + Z | Undo |
| Ctrl / Cmd + Shift + Z, or Ctrl / Cmd + Y | Redo |
| Ctrl / Cmd + S | Save the form |
Unsaved changes
If you try to leave the editor with unsaved changes, your browser asks you to confirm. Save often, and always save before opening Preview or Settings.
The submit button
Click the Submit button at the bottom of the canvas to change it:
- Button Settings: Button Text, Button Text While Sending, Button Size (Small, Medium, Large) and Button Alignment (Left, Center, Right, Full Width).
- Button Styling: Background Color, Text Color, Border Radius, Font Size, Font Weight and Height.
To place the button somewhere else in the form, or to add a second one, use the Custom Submit Button field.