- Overview
- Using the web form builder
- Using web form widgets
- Add cloneable web form sections
- Show or hide widgets using conditional logic
- Create a multi-page web form
- Board multi-location merchants with web form
- Frequently Asked Questions
- Videos
Overview
Once you’ve configured your web form settings, you can begin building the form using the drag-and-drop form builder.
To design your form, simply drag widgets—such as form sections, pricing tables, and other available components—from the widget sidebar into the main design area. Then, add the necessary lead fields by dragging them into the appropriate form sections.
These lead fields are automatically mapped to the corresponding fields in your system, ensuring that all submitted data is captured and properly stored.
To ensure data accuracy and completeness, you can mark fields as required, apply validation rules (such as ensuring selected values total 100%), and use conditional logic to dynamically show or hide specific fields or sections (such as pricing plans) based on the user’s selections.
Additionally, you can include a consent checkbox in your form to ensure that merchants acknowledge and accept your terms and conditions before submission.
Using the web form builder
To begin creating or editing a web form, go to Manage → Web Forms → Manage Web Forms, then click Edit Form next to the desired form.
The web form builder interface will open, displaying:
- The Widgets panel on the left
- The Design area in the center
- The Lead Fields panel on the right
Both the widget and lead fields panels can be collapsed to expand the design area if needed.
To start building your form, drag a Section widget from the panel into the design area.
Once the section is in place, drag the relevant lead fields into that section.
You can rearrange sections and fields at any time by dragging them within the design area.
At the top of the builder, you’ll find quick action buttons. When you're done editing, click Save to apply your changes.
Web form widgets overview
The Web Form Builder includes a Widgets Panel, which serves as the toolbox for creating and customizing your web forms.
This panel is located on the left side of the builder interface and provides a variety of components—called widgets—that can be dragged and dropped into the design area.
In addition to form construction, the widgets panel also functions as the properties editor.
Clicking on any widget in the design area automatically displays its configuration options in the panel for easy modification. To customize a widget:
- Click the widget in the design area.
- The widget’s properties will automatically display in the left panel.
- Make adjustments as needed (e.g. change the title, text, and settings such as required or read-only status etc.).
Changes are reflected in real-time. To finalize your edits, use the Save button located at the top of the page.
The web form widgets are organized into two categories:
- Layout Widgets – used to structure and visually organize your form
- Section Widgets – used to add functional elements within sections
Layout Widgets
Layout widgets help define the overall structure and visual flow of your web form.
| Widget | Description |
| Section | A container for grouping related fields (e.g., Business Info, Owner Info, Pricing). Sections can be made cloneable to let merchants enter multiple sets of information—such as details for additional owners, locations, or other repeating data. |
| Compact Section | Similar to the Section widget but with a smaller header and no separator line. |
| Helper Text | A customizable yellow bar used to display additional instructions or context. Color settings can be customized. |
| Text Box | Adds formatted text between sections—useful for explanations or headers. |
| Divider | Inserts a horizontal line and title to visually separate sections of the form. |
| Consent Checkbox | Displays your terms and conditions, which users must accept before submitting the form. |
Section Widgets
These widgets are placed within a section and support key interactive features.
| Widget | Description |
| Document Button | Enables clients to upload supporting documents (up to 25 per button). |
| Helper Text | Same as the layout version, but positioned inside a section. |
| Text Box | Functions like the layout text box, but appears within a section. |
| Fees Table | Creates a simple table for listing fee names and amounts. Fees are added by dragging relevant fields from the lead section into the table. |
| Pricing Table | Builds a pricing table with various card brands. Fields are also added via drag-and-drop from the lead section. |
| Image | Allows insertion of images, either uploaded or linked from an external source. |
| Copy Button | Lets users duplicate field values from one section to another (e.g., from Business Info to Legal Info). |
| Sum Validation | Validates that the total of selected numeric fields matches a predefined value (e.g., 100%). If not, an error message will appear. |
Cloneable sections
A section widget can be configured to be cloneable, allowing the person filling out the web form to dynamically generate additional instances of that section as needed.
Example Use Case
To enable your clients to add multiple owner sections (e.g., additional business owners), you can activate the cloning functionality by selecting the "Include Additional Sections Button" checkbox within the section’s settings.
When this option is enabled, the section will automatically resize to half the width of the form to allow room for newly added sections.
Additional Configuration Options
Once the "Include Additional Sections Button" checkbox is selected, additional configuration settings will appear directly below it. These options allow for further customization of the cloneable section’s behavior.
You can click the info icon next to each setting to view a tooltip explaining its purpose and functionality.
Important: To ensure proper data capture and organization in your CRM, it is strongly recommended that cloneable section widgets are mapped exclusively to lead record sets, and not regular tabs.
This ensures that each repeated section corresponds directly to an individual record set on the lead.
End-User Experience
After the form is saved and published, the user completing the web form will see an Add Owner button (or similar label depending on your configuration).
Clicking this button allows them to add multiple owner sections dynamically, making the form more flexible and user-friendly.
The Primary Owner section on the form is automatically mapped to the first record set on the Owner tab. When an additional section is added (e.g., Secondary Owner), it maps to the second record set.
Below is an example of a lead generated in the CRM from a web form, where each of the two owners has their information neatly captured in its corresponding owner record set.
Using Conditional logic
Conditional Logic lets you create dynamic web forms that show or hide specific fields or sections based on user input—making forms cleaner and more user-friendly.
To begin setting up conditional behavior in your form, open the form in the editor, click the Conditional Logic button, and then Add Conditional Logic to create a new rule.
How It Works
Each rule has two parts:
- IF condition – defines what to watch for
- THEN action – defines what happens when the condition is met
Example: If a checkbox is selected (IF), then a hidden section appears (THEN).
Use Add Condition to include multiple conditions with AND/OR logic, and Add Action to set multiple outcomes.
Building a Condition
To set up a condition, you'll need to define the widget and the logic that triggers an action. Follow these steps:
- Select a widget type (only those already used in your form).
- Choose the specific widget (e.g., checkbox or dropdown).
- Select an operator (e.g., equals, greater than).
- Enter the value to compare (e.g., “checked”).
Define an Action
After setting the condition, you'll choose what happens when it's met. You can define one or more of the following actions:
- Show or hide a widget or section
- Enable or disable a field
- Auto-fill a field value
Once you configure your condition it will appear in the Conditional Logic popup, where you can edit, copy, or delete it anytime.
To complete your setup close the Conditional Logic popup and click Save in the top-right corner of the page.
Note: Fields using conditional logic display a blue split-arrow icon in the editor. Click it to jump straight to the logic settings.
IMG
Example
The example below shows a conditional rule that checks the "Tiered" checkbox on the web form. When the checkbox is selected, the rule automatically displays the Tiered section and hides the Flat Rate section.
Note: In the example above, the Tiered section must be hidden by default in order for the Show action to take effect.
Here is another image that shows a merchant selecting the Tiered checkbox, which dynamically replaces the Flat Rate pricing section with Tiered pricing.
Multi-Page Web Form
When a web form contains a large number of fields, presenting everything on a single page can quickly overwhelm users. That’s why the CRM Web Forms can be easily set up as multi-page forms, helping you break down complex forms into more manageable steps and improving the client experience.
A multi-page form gives users a clear sense of progress. At the top of the form, there's a progress bar that shows which page they’re currently on and how many pages remain.
After completing a page, users can either click the Next button at the bottom to move forward or jump to a specific page by clicking its name in the progress bar.
At the end of the form, you also have the option to display a summary page. This page shows a consolidated view of all the information entered, allowing the user to double-check everything before submitting.
If something needs to be changed, they can simply click a pencil icon next to a section to go back and edit that specific page.
This setup is ideal when you want to ensure accuracy before submission—especially for forms involving sensitive or business-critical information.
Note: The summary page supports only a limited set of widgets including:
-
Helper Text
-
Text Box
-
Divider
-
Consent Checkbox
Creating a multi-page form
To create a multi-page web form, you’ll begin the same way you would when creating any new form.
Once you’re in the form design step, look for the Form Pages button. Clicking this opens the settings for managing pages.
Next, take the following steps to enable multiple pages:
-
Select the Enable Multi-Pages checkbox in the Form Pages widget.
-
Click Add Page to begin creating additional pages.
Every time you add a new page, the design canvas updates with a new page section, and the progress bar at the top adjusts accordingly. This gives users a clear view of where they are in the process.
From there, start dragging your section widgets into the appropriate page.
If you'd like to include a summary page at the end of your form, check the box labeled Include Form Summary Page.
Example
In the below example we have added two pages called Location Info and Corporate Info, and we also enabled the Summary Page. After that, we moved the Business Information and the Corporate Information section widgets into the appropriate pages.
Boarding multi-location merchants with web forms
Boarding merchants with multiple locations is more efficient with multi-location web forms. These forms allow merchants to submit all location details in one place, automatically generating and linking the necessary lead records and documents.
You can configure the form to let merchants dynamically add sections for each location. Upon submission, the system creates a separate lead for each location and links them together.
After boarding, these leads can also be linked to the merchant account (see: Linking Leads To Merchant Accounts).
If needed, the form can trigger an e-signature document—such as a merchant processing agreement—with a main section and dynamic sections for each location. Once signed, the document is saved to the primary lead and attached to each additional lead.
How to Create a Multi-Location Form
To make a multi-location web form, follow these steps:
- Add a new section widget to the form that will hold each location’s information.
- Open the section settings and configure the following:
- Set a clear title for the section (e.g. Location Info).
- Enable the “Include Additional Sections” option to let merchants add more locations.
- Customize the button text (e.g., “Add Location”).
- Set the maximum number of locations that can be added.
- Choose whether the section should appear full-width.
- Set naming preferences for added sections:
- Choose between incremental numbering (e.g., Location Info #1, #2...) or descriptive labels (e.g., Primary, Secondary).
- Turn on “Create Lead for Each Added Section” to generate a lead per added location.
- Optionally enable “Add E-Signature Document for Each Added Section” to attach secondary documents for each location.
- Optionally enable the “Copy Data” button to allow merchants to duplicate section data across locations.
With the new section in place, drag the required lead fields from the lead panel into the section.
Note: When generating e-sign documents, each location’s fields appear in its own appended document. If a field (like the business address) exists in both the main and location-specific sections, the location-specific version takes priority.
Submitting the Form
When a merchant uses the form, they can now add as many locations as allowed using the “Add Location” button.
Once submitted, a lead is created for each location and automatically linked to the primary lead. These linked leads can be accessed by clicking the link button next to the business name on the lead’s page.
Frequently Asked Questions
- Can I customize the form colors and add my logo? Yes, the form's colors and logo can either be inherited from your group settings or customized manually. These options are available in the Web Form sharing settings. For detailed instructions, please refer to our article on Sharing the Web Form.
Videos
Here are some additional video resources on building the web form:
- Conditional logic release announcement.
- Multi-page web form walkthrough.
- Multi-Location web form walkthrough.