Form Builder Guide

Master the FormLeap form builder and create powerful forms with this comprehensive guide.

Form Basics

Form Settings

Every form has settings that control its behavior. Access them by clicking Settings in the form builder.

General Settings

Form Name - Displayed to you (not to respondents)
Description - Internal notes about the form's purpose
Status - Draft or Published

Access Control

Control who can access your form:

Public - Anyone with the link can submit
Email Required - Respondents must verify their email first
Password Protected - Require a password to access the form

Learn more in Advanced Features → Access Control.

Submission Settings

Confirmation Message - Shown after successful submission
Redirect URL - Send users to a specific page after submission
Allow Multiple Submissions - Let users submit more than once
Email Notifications - Get notified of new submissions

Steps (Multi-Step Forms)

Break long forms into multiple steps for better completion rates.

Creating Steps:

Click Add Step in the left sidebar
Enter a step title (e.g., "Personal Information")
Add fields to the step
Repeat for each section of your form

Step Navigation:

Respondents see a progress bar showing their position
Next button advances to the next step
Back button returns to the previous step
Submit button appears on the final step

When to Use Multi-Step:

Forms with 10+ fields
Forms covering multiple topics
Forms where you want to reduce cognitive load
Applications, surveys, onboarding flows

Publishing

Draft Mode:

Edit freely without affecting users
Preview at any time
Not accessible to respondents

Published Mode:

Form is live and accessible
You can still edit (changes appear immediately)
Respondents can submit

To publish: Click Publish button in top right.

To unpublish: Click Unpublish (form becomes inaccessible but data is preserved).

Field Types

FormLeap supports a wide variety of field types for different data collection needs.

Text Input Fields

Text

Single-line text input for names, titles, short answers.

Configuration:

Placeholder text
Min/max length validation
Pattern validation (regex)
Required toggle

Example Use Cases:

First name, last name
Job title
Company name
Product name

Textarea

Multi-line text input for longer responses.

Configuration:

Placeholder text
Min/max length validation
Number of rows (height)
Required toggle

Example Use Cases:

Comments and feedback
Cover letters
Descriptions
Open-ended questions

Email

Email address with built-in validation.

Configuration:

Placeholder (e.g., "you@example.com")
Required toggle
Automatic format validation

Example Use Cases:

Contact email
Work email
Notification preferences

Phone

Phone number input.

Configuration:

Placeholder
Pattern validation for specific formats
Required toggle

Example Use Cases:

Contact number
Emergency contact
Work phone

URL

Website URL with validation.

Configuration:

Placeholder (e.g., "https://example.com")
Required toggle
Automatic URL format validation

Example Use Cases:

Company website
Portfolio link
LinkedIn profile
Social media links

Number Fields

Number

Numeric input with validation.

Configuration:

Minimum value
Maximum value
Step (increment, e.g., 0.01 for decimals)
Required toggle

Example Use Cases:

Age
Quantity
Price
Rating (1-10)

Date & Time Fields

Date

Date picker for selecting dates.

Configuration:

Minimum date
Maximum date
Default to today
Required toggle

Example Use Cases:

Birth date
Start date
Event date
Deadline

Time

Time picker for selecting times.

Configuration:

Minimum time
Maximum time
Required toggle

Example Use Cases:

Appointment time
Availability
Meeting time

DateTime

Combined date and time picker.

Configuration:

Minimum datetime
Maximum datetime
Required toggle

Example Use Cases:

Event start/end
Appointment booking
Deadline with time

Selection Fields

Dropdown

Single-select dropdown menu.

Configuration:

Options list (one per line)
Default selection
Required toggle

Example Use Cases:

Country selection
Department
Product category
Status

Radio

Single-select radio button group.

Configuration:

Options list
Default selection
Required toggle
Layout (vertical or horizontal)

Example Use Cases:

Yes/No questions
Multiple choice (single answer)
Rating scales
Agreement levels

Multiple Choice

Multi-select checkbox group.

Configuration:

Options list
Minimum selections required
Maximum selections allowed
Required toggle

Example Use Cases:

Interests or hobbies
Services needed
Features requested
Days available

Yes/No

Simple toggle for binary choices.

Configuration:

Default value (Yes/No)
Required toggle

Example Use Cases:

Agree to terms
Opt-in checkboxes
Binary preferences
Eligibility questions

File Upload

Allow respondents to upload files.

Configuration:

Accepted file types (PDF, images, documents)
Maximum file size (in MB)
Maximum number of files
Required toggle

Example Use Cases:

Resume/CV upload
Document submission
Photo upload
Proof of identity

File Type Examples:

Documents: .pdf, .doc, .docx
Images: .jpg, .png, .gif
Spreadsheets: .xls, .xlsx, .csv

Content Elements

Content elements don't collect data—they provide structure and context.

Heading

Add section titles to organize your form.

Configuration:

Text content
Level (H1 through H6)

Example:

Heading Level 2: "Contact Information"
Heading Level 3: "Your Details"

Paragraph

Add explanatory text or instructions.

Configuration:

Text content (supports markdown)

Example Use Cases:

Instructions
Disclaimers
Context for questions

Divider

Visual separator between form sections.

Configuration:

Style (solid, dashed, dotted)

Field Configuration

Labels and Placeholders

Label:

Visible above the field
Describes what the field is for
Required for all input fields
Shown in submission data

Placeholder:

Gray text inside the field before user types
Disappears when user starts typing
Should be an example, not instructions
Optional

Example:

Label: Email Address
Placeholder: you@example.com

Help Text

Additional guidance shown below the field.

When to Use:

Format requirements
Examples
Clarifications
Tips

Example:

Label: VAT Number
Help Text: Enter your 9-digit VAT number (e.g., 123456789)

Required Fields

Mark fields as required to ensure respondents provide essential information.

How to Set:

Toggle "Required" in the field properties
Required fields show a red asterisk (*) in the form

Validation:

Form cannot be submitted if required fields are empty
Error message appears: "[Field name] is required"

Validation Rules

Add custom validation to ensure data quality.

Text Validation

Min Length - Minimum number of characters
Max Length - Maximum number of characters
Pattern - Regular expression (advanced)

Example:

Field: Username
Min Length: 3
Max Length: 20
Pattern: ^[a-zA-Z0-9_]+$ (alphanumeric and underscore only)

Number Validation

Min - Minimum value
Max - Maximum value
Step - Increment (1 for integers, 0.01 for decimals)

Example:

Field: Age
Min: 18
Max: 100

Layouts

Control how fields appear on the form.

Default Layout (Stack)

Fields appear one per row, stacked vertically.

Best for:

Simple forms
Mobile devices
Maximum clarity

Row Layout

Place fields side by side in the same row.

How to Use:

Add fields to a Composite element
Set layout to "Row"
Fields appear horizontally

Best for:

Related short fields (First name / Last name)
City / State / Zip
Compact forms

Grid Layout

Organize fields in a multi-column grid.

Available Grids:

2 columns
3 columns
4 columns

How to Use:

Add fields to a Composite element
Set layout to "Grid 2", "Grid 3", or "Grid 4"
Set col_span on individual fields to control width

Column Spanning:

col_span: 1 - Takes 1 column (default)
col_span: 2 - Takes 2 columns
col_span: 3 - Takes 3 columns
col_span: 4 - Takes 4 columns (full width)

Example: 2-Column Address

[Street Address]  (col_span: 2, full width)
[City]            [State]
[Postal Code]     [Country]

Responsive Design

All layouts automatically adjust for mobile devices:

Grids become stacked on small screens
Row layouts stack vertically
Touch targets are appropriately sized

Field Presets

Save time with pre-configured field collections.

Country Selector

Dropdown with all countries.

Features:

195+ countries
Alphabetically sorted
Search enabled

Currency Selector

Dropdown with major world currencies.

Features:

150+ currencies
Format: USD - US Dollar
Includes currency codes

Year Selector

Dropdown for selecting years.

Configuration:

Start year (e.g., 1900)
End year (e.g., 2030)
Sort order (ascending/descending)

Language Selector

Dropdown with languages.

Features:

100+ languages
Native and English names

Timezone Selector

Dropdown with timezones.

Features:

All IANA timezones
Format: America/New_York (EST)

Days/Months Selectors

Days: Monday through Sunday Months: January through December

Best Practices

Form Design

Keep it short - Only ask for necessary information
Group related fields - Use steps or composite fields
Use clear labels - Avoid jargon or abbreviations
Provide help text - Clarify format requirements
Test on mobile - Most users submit from phones

Field Order

Start with easy questions - Build momentum
Group by topic - Keep related fields together
Save sensitive data for last - Build trust first
End with open-ended questions - After required fields

Validation

Mark required fields clearly - Use asterisks
Validate early - Show errors as users type (for format)
Use helpful error messages - "Email must include @"
Don't over-validate - Accept reasonable variations

Accessibility

Use proper labels - Screen readers rely on them
Provide sufficient contrast - For readability
Support keyboard navigation - Tab through fields
Don't rely on color alone - Use icons and text

What's Next?

Advanced Features - Logic jumps, composite fields, file uploads
Managing Submissions - View and export responses
Integrations - Webhooks and embedding

Need help? Check out our other guides or contact support@formleap.app