A New Take on Web Form Building – Part 3

We’re continuing our exploration of the additions and changes in our new Form Builder.
We’ve seen how to do the basic editing and how to edit field properties. We’re now going to look at how you can reorganize your web form by deleting, copying or moving form elements.

The Outline
If you’re familiar with the older version of our form building tool, you might remember that those three operations could be done with the Outline.
The outline is still here, and still a great way to work through long forms. You can use it to reorder form fields with drag&drop, or to quickly jump to any part of the form.
It’s no longer visible by default though, since all tasks that used to require the outline can now be done directly in the preview area. To show the outline [2], go to the “view” menu [1] and click “outline”.
TIP: Your preference is automatically saved, so next time you open a form, the outline will be visible.
Copying & Deleting
The copy option [3] is now available in the sidebar – which can be accessed by selecting a form element and clicking the blue “options” icon. In some browsers, you can also use a right click in the preview to bring up a contextual menu with the “copy” option.
The delete option is available in the sidebar and on the floating toolbar.
Moving Elements
The sidebar [3] offers two additional options to move the selected form element up or down. You can also simply drag&drop from the preview to any new location in your form. Check out the screencast below for a quick demonstration.
filmPlay “Moving Form Elements” Screencast (52s)

If you are wondering how to place fields side-by-side, we’ll cover that and more in the next post. Subscribe to our RSS feed or follow us on Twitter to be notified when it is published.
In the meantime, click here to play with the form builder.

Don’t just collect data — leverage it.