5 Easy New Ways to Change the Look and Feel of Your Web Form

Disclaimer: As of June 2018, Form Builder 5.0 is the default version of the FormAssembly Form Builder. Visit the release blog post to learn about the Form Builder 5.0 improvements.

We’ve listened to your feedback, and we’re pleased to introduce the latest improvements to the FormAssembly Form Builder. Here’s a run-down of what you can do now:

And now for the full story on how it all works…

1. Changing the width of Your form

Although web forms made with FormAssembly automatically shrink down to fit the screen of a mobile device (like an iPhone), the default width for forms viewed on a regular computer screen is 700 pixels.
But you don’t have to stay married to that setting. You can make your web form as wide or as skinny as you please to best fit your site. You used to have to jump through a couple of hoops to change it, but now it’s easy: Just click on the “Properties” menu, select “Form Width,” and type in the new width that you want:
form width

2. Quickly edit of a list of checkboxes and radio buttons.

Adding more choices to a list of buttons and checkboxes just got easier: You can add multiple options as fast as you can type. Just click “Edit choices” displayed under your list of buttons or checkboxes and start typing (or pasting copied text, that works too). Hit enter, type another choice, hit enter, type another one–well, you get the idea.
list choices

3. Add headings anywhere in your form.

You can also add headings to your forms–bolded text that stands out from the rest. Click the “Add Content” menu, go to “Text & Image,” and select “heading.” The heading will be added to the bottom of the form, but like every other form element, you can drag and drop it wherever you want.
Add a Headings to your web form

4. Drag and drop form fields to the same line

Speaking of drag and drop, you can now line up form fields so that they’re side by side. Just click the element you want and drag it where you please. It often looks better to group certain form fields together and keep them cozy, especially if they’re closely related.
place form fields on the same line with drag & drop

Placing fields on the same line with drag&drop.

Actually, having multiple form fields on the same line was already possible before this update. It just wasn’t so simple, since it involved grouping form elements in a section and hunting down the “continuous line” option in the presentation menu. You can still do it that way if it makes you happy, but drag and drop makes life so much easier.

5. Display Labels Below Form Fields

Previously, you could change form labels to display left, right, or above the form fields. But have you ever wanted to display them below the form fields?
label below input
Well, now you can do that, and there are two ways to go about it:
1. If you want ALL the labels to go under the form fields, click on “Properties,” go to “Default Layout,” and select “Labels Below.”
2. To change just one label, click on the form element you want to edit. Click “Options.” In the sidebar menu that appears, click “Presentation,” then select the “Label Placements” menu, and finally select “Below” from the drop-down list.

That’s all for Today!

We welcome your feedback and hope you try some of these out! Feel free to drop us an email if you have any questions. If you’d like to keep up with the latest updates, be sure to follow us on Twitter or subscribe to our RSS feed.

Don’t just collect data — leverage it.