Skip to content

Help Center

Add hidden fields to Typeform forms

Typeform is a form building tool that creates beautiful, question-based forms. Attributer can integrate with Typeform to pass through UTM parameters and other marketing attribution data about any leads that complete your forms.

In this article, we’ll outline how to add the hidden fields and set up the ‘field aliases’ so Attributer can find them.

Step 1: Open the form you want Attributer to work with

In your Typeform account, locate the form you want Attributer to work with and click on it.

Step 2: Add 6x hidden fields to the form

Now that the form builder is open, select the ‘Logic’ tab in the right-hand sidepanel.

When the Logic section opens, select the ‘Advanced’ tab and then select the ‘Hidden Fields’ option.

In the popup that appears, click the ‘Add Hidden Field’ 6 times in order to add 6 hidden fields to your form.

Ultimately, you want your form to look like this:

Step 3: Configure the fields

Next, you need to give each of your hidden fields a name. You can name a hidden field by simply clicking inside the name (I.e. @hidden1 or @hidden2).

You need to give your fields the following names:

  1. channel
  2. channeldrilldown1
  3. channeldrilldown2
  4. channeldrilldown3
  5. landingpage
  6. landingpagegroup

Ultimately, you want your form to look like this:

Finally, click ‘Save’ to save your changes to the hidden fields.

Step 4: Configure default values

Default values are a function of Typeform that allow you to essentially set the default value for each of your hidden fields. Attributer will look for these default values and overwrite them with the real data about your visitors.

To configure default values, navigate to the ‘Share’ section of the form builder and then select the ‘Standard’ under the ‘Embed in a Webpage’ heading.

Once in the Standard section, click on the word ‘Advanced’ to open up the area where you set the default values.

In the boxes that appear, add the following default values:

Hidden Field NameAlias
@channel[channel]
@channeldrilldown1[channeldrilldown1]
@channeldrilldown2[channeldrilldown2]
@channeldrilldown3[channeldrilldown3]
@landingpage[landingpage]
@landingpagegroup[landingpagegroup]

Ultimately, you will want it to look something like this:

Some default values are cut off in the above screenshot due to the small size of the textboxes

Step 6: Embed the form on your website

Now that you have set up the default values, simply click the ‘Get the code’ button at the bottom and a popup will appear giving you the code you need to embed on your website.

Simply copy the code and paste it into your website wherever you want the form to appear.

That’s all you need to do! Moving forward, each of your form submissions will come through with marketing attribution data provided by Attributer.

Can't find the answer you need? Contact us!

Our team are available to answer any questions you have

Support Images