Creating Your First Form

This guide will walk you through the process of creating your first form with FluidForms. It's designed to be simple and get you started quickly.

Starting a New Form

1. Navigate to Forms: From your FluidForms dashboard, ensure you are in the "Forms" section (this is often the default view).

2. Initiate Form Creation: Look for a button labeled "Create New Form" and click it.

3. Choose Your Starting Point: You'll have a couple of options:

   • Start with a Template: FluidForms offers a variety of pre-designed templates tailored for common use cases such as "Contact Us," "Event Registration," "Feedback," etc. Selecting a template can give you a great head start.

   • Start from Scratch: If you have a specific vision or unique needs, you can choose to build your form on a blank canvas.

The Form Builder Interface

Once you've chosen your starting point, you will enter the Form Builder. This is where you'll design and configure your form. The interface generally includes:

• Field Palette: This is a sidebar or panel containing all the fields in your form. You can click the "Add field" button to add additional form fields.

• Form Canvas: The central area where you view your form preview.

• Settings/Properties Panel: When you select a field on the left panel, this panel will display its editable properties and configuration options.

Adding and Editing Fields

Adding a Field

1. Find the Field: In the Field Palette, click the "Add Field" button.

2. Select your field: Choose from a range of field types to add to your form. For example, Text, Email, Rating, Comment or Payment.

FluidForms Pro users have access to all field types, including advanced fields such as payment and signature fields.

Common Field Types

Here are some of the basic field types you'll frequently use when building forms:

• Text Input: Used for collecting single lines of text, such as names, subjects, or short answers.

• Email Input: Specifically designed for capturing email addresses. It often includes built-in validation to check if the input looks like a valid email format.

• Text Area: For collecting longer blocks of text, like comments, messages, or detailed feedback.

• Multiple Choice (Radio Buttons): Allows users to select only one option from a predefined list.

• Checkboxes: Enables users to select one or more options from a predefined list.

• Dropdown Select: Presents a list of options in a compact dropdown menu that expands when clicked, from which a user can select one option.

Editing Field Properties

Customizing your fields is key to making your form effective:

1. Select the Field: Click on any field in the left-panel. This will activate it for editing.

2. Use the Properties Panel: The Settings/Properties Panel will now show all the configurable options for the selected field.

3. Common Properties to Edit:

   • Label: This is the question or title for the field that users will see (e.g., "Your Full Name," "How did you hear about us?").

   • Placeholder Text: Faint text that appears inside the input field before the user types anything. It can provide an example or hint (e.g., "e.g., John Doe").

   • Required Field: A toggle or checkbox that makes filling out this field mandatory before the form can be submitted. Required fields are often marked with an asterisk (*).

   • Options (for Multiple Choice, Checkboxes, Dropdown): For these field types, you'll need to define the list of choices that users can select from. You can typically add, remove, and reorder these options.

Saving Your Form

It's crucial to save your work as you build your form:

• Locate the "Save Form" button at the top-right of the screen.

• Click it to save your current progress. It's a good habit to save frequently, especially after making significant changes.

Previewing Your Form

Before you share your form, you'll want to see how it looks and behaves:

• Look for a "Preview" button or icon. Clicking this will open a new tab or window showing you what your form will look like to your users.

• Use the preview to test the layout, check for typos, ensure all fields are working correctly, and verify that required fields are enforced.

Congratulations! You've now learned the basics of creating your first form in FluidForms. With these fundamentals, you can start collecting information. In subsequent guides, we'll cover more advanced features like styling, conditional logic, and integrations.