Skip to main content

Forms on Landing pages

This article contains the following topics (click on them to jump to the corresponding place):

Create forms

Drag the block labelled "Form" to the desired location on your landing page and then click on "Change Form".

If you are using a Quentn template, click on the existing form. Then click on "Change Form" on the right-hand side to customise it.

Formular_anpassen.png

This will open up a pop-up window. On the left-hand side, tick which fields the form should contain and which forms should be required for entry.

On the right-hand side you'll see the settings. Under "Position of the field name" you can determine whether the name of the field should be above ("outside") or inside (placeholder) the field.

form.png

Attention: You cannot select your custom contact fields for landing page forms.

Hidden fields (for multi-device tracking)

You can also integrate hidden fields in your form, e.g. to enable multi-device tracking.

  • Click on "Settings for hidden fields".
  • Under "Field", select your own text field.
  • Under URL parameters, enter exactly this (e.g. affid)

You can find more information on multi-device tracking in this blog post.

Pre-filled forms  

If you send known visitors - i.e. contacts who are already in your Quentn system - to your landing page form (e.g. via a campaign), you can automatically pre-fill the form so that the contact only has to supplement information if required.

To pre-fill a form, you first need the link to the page where the form is located. You should include this link in your campaign email.

Now you have to add the URL parameters to the link.

Add a question mark at the end of the URL and determine which fields should contain which information. Use placeholders to take the place of the exact terms. To specify several fields, place an "&" between the parameters. Do not use spaces!

For example, we ask for the first name, last name and email in our form. This data should be created in Quentn. The URL of the form with the default data then looks like this:

https://meinetestseite.de/?first_name={{contact.first_name}}&family_name={{contact.family_name}}&mail={{contact.mail}}

Attention: the placeholders depend on which editor you have installed in the emails! If you use the old editor, you must use the old format of the placeholders in the link. Our example would then look like this:

https://meinetestseite.de/?first_name=[contact:first_name]&family_name=[contact:family_name]&mail=[contact:mail]

When sending the link, the form is pre-filled for known visitors.

A cookie is also embedded so that the form is pre-filled when the visitor returns to the page via another route.

Create multi-level forms

With the landing page builder, you can also create multi-level forms.

  • Use two landing page elements for this.
  • Firstly, configure the second element and copy the page URL.
  • In the first element, click on the tab "Thank you page" and enter the page URL of the second page.
  • Suffix the GET parameters for the email address to this URL (?mail={contact.mail}}).

Note: Quentn form can also be used

If you don't like the landing page form, e.g. because you want to query your own contact fields, you can of course also use a Quentn form. You can use the code snippet (JavaScript) to insert it into the landing page via an HTML block.

Please note that the e-mail confirmation and all subsequent elements must then be linked to the form and the landing page stands alone.

Related articles