Data capture forms are blocks with fields where website visitors enter their personal information (email addresses or phone numbers). You can receive such information via data capture services.
You can find blocks with forms in the "Form" and "Cover" categories in the Block Library, there are some forms in the "Contacts" and "Footer" categories as well.
There are also lots of ready-made form templates with multiple fields in the "Quiz form" template category.
Read this guide to learn how to add and customize form input fields and view leads on Tilda.
There are also lots of ready-made form templates with multiple fields in the "Quiz form" template category.
Read this guide to learn how to add and customize form input fields and view leads on Tilda.
How to add custom fields to a data capture form
Each form can have an unlimited number of fields.
You can customize form input fields in the Content panel of the block under the "Input fields" tab.
You can customize form input fields in the Content panel of the block under the "Input fields" tab.
Each field has an individual card where you can specify its type, title, subtitle, hint (placeholder), variable name, and set the field as required or optional.
Title. Specify which information is required, for example, "Your name." This text will appear above the field.
Subtitle. If necessary, add a description or instructions, for example, "Enter your first name and surname." This text will appear above the field and under the title.
Placeholder. Give an example of how the field should be filled. For instance, "John Dawson." This text is visible inside the field before it's filled out.
Required field. Select this checkbox to make the field required. Visitors won't be able to submit the form without filling in this field.
A variable name is set by default, depending on the field type. If data capture services require a specific name of your variable, simply change it. For example, Mailchimp and Bitrix24 both have pre-set variables.
Subtitle. If necessary, add a description or instructions, for example, "Enter your first name and surname." This text will appear above the field and under the title.
Placeholder. Give an example of how the field should be filled. For instance, "John Dawson." This text is visible inside the field before it's filled out.
Required field. Select this checkbox to make the field required. Visitors won't be able to submit the form without filling in this field.
A variable name is set by default, depending on the field type. If data capture services require a specific name of your variable, simply change it. For example, Mailchimp and Bitrix24 both have pre-set variables.
Forms support several types of variables for different types of input data. Please find the descriptions and useful information about types of input fields in the table below:
To ensure everything works properly, we recommend using variable names in Latin letters.
Variables display in the form
Variable names can display data values the user has entered in the form, showing this information in the step title or description. For example, you can show the user's name they provided earlier in the quiz, making the experience more personalized.
Variable display works only on the published page and within a single block.
Variable display works only on the published page and within a single block.
The user entered their name in the previous step, and it is displayed in the next question.
This feature is only available in testing mode. To access it, select the "Opt-in to become a beta-tester and try new features before they are released" checkbox in your Profile.
To display the variable value, use the {{form.name=def}} expression in the form field, where:
form: The required prefix that must come before the variable name and its value.
name: The variable name specified in the field content.
def: An optional default value that appears in the block if the corresponding field is left blank.
form: The required prefix that must come before the variable name and its value.
name: The variable name specified in the field content.
def: An optional default value that appears in the block if the corresponding field is left blank.
If the user leaves the field empty, the default value will be displayed. You can specify any word or phrase as the default value instead of "def."
Variable values can only be displayed from fields that support specifying variable names. Displaying values is not possible for field types such as "Promo code," "Advanced delivery options," and "Text comment."
The variable value display will not work if a field is hidden in the settings.
The variable value display also will not work for the "Question with answers," "Question with image answers," and "Dropdown" field types.
The variable value display will not work if a field is hidden in the settings.
The variable value display also will not work for the "Question with answers," "Question with image answers," and "Dropdown" field types.
When trying to add the {{form.example=def}} expression as one of the answer options, an error occurs. The Dropdown field value, however, is displayed correctly.
Currently, variable value display is not supported in Zero Block forms.
How values are displayed in certain field types:
- The checkbox is displayed as "Yes/No."
- In the "Question with answers" field with the "Multiple choice (checkboxes)" option enabled, values are displayed as "Option 1," "Option 2."
- Custom answers appear without a title if a value was previously entered by the user.
If the "Variable name" value is not specified for the field, the text from the "Input title" will be sent to the data collection services instead. In this case, if the {{form.name=def}} expression is part of the title, it will be omitted.
How to customize the look of a data capture form
You can customize your form look in the block settings. If there are several fields in the form, you can edit the fields and texts, customize buttons, and add animation.
The style of input fields
Button settings
General form settings
- Text for placeholders and titles—color and saturation.
- Color of checkboxes, radio buttons, and other elements.
- Border style—color, corner radius, weight, use of the lower border only.
- Placeholder (value hint) style—option to leave the placeholder visible or not.
Button settings
- Background and border color; option to change color on hover.
- Shadow; option to change shadow on hover.
- Text color; option to modify it on hover as well as typeface, font size, and saturation.
- Animation speed on hover.
General form settings
- Form width (Tilda layout is based on a 12-column grid). Column width and left margin are set in the columns. Most often, forms are 8 columns wide with a left margin of 2 columns.
- Form title is not shown to the visitors. It is sent to data capture services and helps to identify the source form of the lead.
- Animation: 6 different options for the form to appear on screen.
How to view leads and error logs
After form fields and data capture services have been set up and activated, leads are sent to the connected data capture services. You can view your leads, check if the submitted data is correct, or find out how to fix errors in the "Leads" section of your project.
Go to Leads from your project dashboard.
Go to Leads from your project dashboard.
All leads from all forms are kept here regardless of whether a third-party data capture service is connected or not.
If you click on a lead, a box with detailed order information will appear.
If you click on a lead, a box with detailed order information will appear.
By default, captured data is kept in the "Leads" section for one month but you can opt to keep it for 1 day or not to keep it at all. To specify your preferences, go to the Site Settings → Forms → General form settings (at the bottom of the page).
If you want to keep leads for a longer time and be able to modify them, connect at least one of these data capture services.
If you want to keep leads for a longer time and be able to modify them, connect at least one of these data capture services.
To view form submission errors, click "Error log". You will be able to check the submission date and tile, data collection service, and error messages.
How to connect data capture services
There are 15+ data collection services integrated with Tilda. You can use email, Google Sheets, email marketing services, messengers, and CRM systems in a couple of clicks. Connect one or several of them to manage your leads.
