In the Landing Pages editor, on the left side under Blocks, you will see the Form option.
With your mouse, drag the Form block onto the canvas. Next you will see:
- On the right side, you will see form options, such as setting a title, a button and what should happen to a contact after filling out the form.
- On the left side, you will see options for form blocks.
Form options
In the form options, there are several elements to set, such as:
Form
Here, you customize texts related to the form. Think of a title and a button text.
Here, you also set a success or error message as a result of submitting the form. This text appears on the page after submitting the form. It is not possible to set another URL as the “Thank You” page.
In addition, you have the following settings:
- Border color for invalid input: Here, you specify the color to be displayed around a form field that has not been entered correctly.
- Recaptcha: Recaptcha detects website abuse without the user realizing it. This tool from Google measures how likely a user is to be spam-sensitive (or a “bot,” for example).
- Recaptcha score: A score of 1.0 is most likely to be a user; a score of 0.0 is most likely to be a bot. Therefore, the average score that can be used is 0.5. Subscribers with a score lower than 0.5, will not be added to your database.
- Place contact in group after confirmation: When the form is sent, the contact can be placed in a group.
- Place new contacts in opt-in group: Checking this checkbox places contacts in the opt-in group after form submission. They will enroll in the opt-in procedure.
Button
On the right side, you will see options to change the styling of the button. For example, you can give the button a background color and change the font size.
Styling
Under the Styling heading, specify the width of the form, the alignment and the background color.
Form blocks
The different form blocks are placed on the canvas by dragging with your mouse or by clicking on the plus sign on the canvas. When you select a form block on the canvas, you will see different options appear.
- With the arrows, it is possible to change the position of a block. Up or down.
- Use the arrow in the square to move your form block directly down or up.
- With the cross, you remove the block.
- You can easily duplicate the form block by using the duplicate page icon.
Form block options
There are several form blocks to choose from:
|
Text field With a text field, collect email addresses or other short text/number-based pieces of information here. For example, first name or phone number. |
|
|
Datepicker With a date picker, the respondent can choose a date using a date picker or fill in their own. For example, birthdate. |
|
|
Text area With a text area, the respondent can enter a text consisting of several lines. |
|
|
Checkbox With a checkbox, you can show multiple options. The respondent can also check multiple options as answers. For example, interests. |
|
|
Hidden field With a hidden field, it is possible to enter predefined data that is not visible to the page visitor. For example, language or customer number. This can also be used when you don't want to show the email field on your form by prefilling it with {{contact.email}}
|
|
|
Dropdown With a dropdown, the respondent can select an option from a predefined list of options. For example, education level. |
|
|
Radio A list of predefined options. The respondent can select one of these options. For example, gender. |
|
|
Single check You can use this form block for (dis)agreeing in a form. For example, accepting terms and conditions. |
|
|
Single opt-in Additional setting: option to prevent submission if the checkbox is not checked. |
For each form field, it is possible to adjust styling settings and apply additional settings.
Settings applicable for all form blocks:
| Label | Name your form field. For example, First name. |
| Link to database field in Spotler MailPro | Select in which database field the entered value should be stored. |
| Field is mandatory | Indicate whether the field is required to be filled in. |
Settings depending on the form block:
| Placeholder | This text populates the input field as an example and disappears when the input field is selected. |
| Field is read-only for known contacts | This field does show, but is not editable if there is already a value present. Only if the field is empty, the respondent can fill out a value. |
| Validate field | This option is default. |
| Min. # of option(s) allowed | For a checkbox field, specify the minimum number of options required to choose. |
| Max. # of option(s) allowed | For a checkbox field, specify the maximum number of options allowed to be checked. |
| Action for existing contacts | Indicate with Overwrite whether you want the value known in the database to be allowed to be overwritten. So, if the checkbox isn't checked, the answer will be emptied. If you don't want this, then select Append. This way, only a checked option will be added to a contact. |
Things to pay attention to when working with forms
There are a few concerns regarding forms and landing pages:
- You can place only one form per landing page.
- The email field is always required in a form
- A form is added within a column of a layout. Padding allows you to narrow fields.
- A form is added within a column of a layout. If you want to display a form on the left or right side of a page, first select a 2-column layout for the page and place the form in one of the two columns.
- Fields in the form are always linked to a database field in the campaign.
- You can prefill contact data in the form that is already known in the database.
- When the form is submitted, the fields are populated in the database. Existing data are overwritten.
- New contacts (based on unique fields, by default the email address) are created as a new contact in the database.