A web form is an HTML form that lets users enter their information. There’s no “one size fits all” when it comes to web forms.
Depending on your business needs and the type of user data you want to collect, you can craft any web forms that fit your needs with Droip.
To add a Form to your page, follow these simple steps:
The Form comes with a set of default form elements, including:
Droip offers various elements to help you design functional forms:
📝 Note: You can add or remove form elements only within the form block.
Once your form is built, configure its behavior in the Form Settings panel.
Name: Assign a unique name to identify the form (e.g., “ContactForm”).
Actions: Define what happens on submission:
Store Form Data: Enable to save submissions directly in Droip’s Form Data Manager.
Max IP Entries: Limit how many times a single IP can submit the form (e.g., set to “1” for one-time entry).
Response Limit: Set a maximum number of total submissions (useful for limited offers or registrations).
After Submit: Choose post-submission behavior:
Each “After Submit” action, Droip lets you define different experiences based on the form’s submission result:
Default (None): The form’s normal state before submission.
Success: Shown if the form is submitted successfully (e.g., showing a success notification or popup).
Fail: Shown if the form submission fails (e.g., showing an error notification or popup).
You can customize the message, design, or triggered action for each state depending on the “After Submit” option you’ve selected, letting you control both what happens and how it looks for each scenario.
Click an input field to access the Input Field Options:
Type: Specify input type (text, email, password, number, date, etc.)
Name: Assign an internal name for data tracking
Character Limit: Set a max number of characters (text inputs only)
Placeholder: Add guidance text inside the field
Required: Mark the field as mandatory
Click a textarea to access its options:
Name: Assign a unique name
Placeholder: Add guidance text
Required: Mark the field as mandatory
Click the select element on the form to access its options:
Name: Assign an internal name. This name is used when processing form submissions (e.g., mapping the selected value).
Options: Add the choices that users can select. Click + Add to add new options. Reorder options easily by dragging them.
Multiple Select: Allow users to select multiple options (or disable for single selection)
Required: Make selection mandatory
Inside the checkbox element, you’ll find:
When you click the Checkbox Input, the Checkbox Options panel appears:
Here you can configure:
Name: Assign an internal name to track the checkbox.
Value: Set the value that will be submitted when the checkbox is checked.
Checked by Default: Enable this to have the checkbox pre-selected.
Required: Mark the field as mandatory (users must check it to submit).
Click the Radio Button element to configure:
Name: Assign a name; this is used during form submission to collect the selected value.
Options: Add, edit, duplicate, delete, or reorder choices
Required: Make selection mandatory
Each option lets you specify:
Content: The visible label, what users will see (e.g., “Option A”)
Value: The actual data on form submission (e.g., “A1”)
When you select the Submit Button in your form, the Submit Button Options panel opens. This panel lets you define what happens after someone submits the form.
Under the Submit dropdown, you can choose one of four actions:
Success Message – Shows a success message on the page after submission. You can enter the message in the Message field.
Go to Page – Redirects users to another page in your project once the form is submitted.
Open Popup – Opens a popup window after submission. Make sure you’ve already created the popup and linked it properly.
External URL – Redirects users to an external website after submitting the form.
Click on the reCAPTCHA element on the form to configure:
Enable reCAPTCHA: Toggle on/off
Version: Choose reCAPTCHA version
Site Key: Enter your reCAPTCHA site key
Click on the File Upload element on the form to configure:
Name: Give your file upload field a name for identification.
Size: Define the max file size.
Select File Types: From this dropdown, select which file types the user will be allowed to upload:
Highlight the focused state of input fields when users click on them or use the keyboard to fill them in. To access the focused state:
Now, you can add a border, change the background color, and style as you wish. This styling will be visible when the input form field is in the focus state only.
Droip also provides a dedicated WordPress dashboard to manage your form data efficiently. To learn how to manage your form data in Droip, refer to Form Data documentation.
Was this page helpful?
Our website uses cookies to improve your browsing experience on our website. By continuing to use this website, you agree to their use. For details, please check our Privacy Policy.
Experience Droip in Action – Explore a live-built page and see the power of our builder in action.
Explore Live