Design Mode

   MaestroThe UI design product.  |   Form Builder  |   21.05 This feature was updated in 21.05.

The Maestro editor comes with the Design Mode functionality, which allows you to create Maestro forms. This is the primary interface for creating and configuring designs.

To view a form in the Design Mode:

1. Open a form or a template in the Maestro editor and click Design.



Note

When you open a design in Maestro, it will open in Design Mode by default.

2. Drag and drop them from the Palette pane. Indicators will appear to inform you where the component will be inserted.
3. All of Maestro's designs are based on Bootstrap's twelve-column grid, which means multiple components can sit within the same row.
4. You may, however, have to adjust the component's column widths via the Properties pane, under the Layout heading.
   Note

   You cannot select multiple components at once within the wireframe.

Here is a quick demonstration how you can design a form by dragging and dropping different components within the wireframe. Expand each animated image to watch it.

Drag and drop them from the Palette pane.

Add another component within the same row.

Next, learn about the rich text editor.