Using Hidden Fields

Hidden Fields are a Free feature that allows you to use data you already have, track information about your respondents, and make your typeforms more personal.

Hidden Fields can be used for lots of things:

• Track the source of respondents (social media channels, for example)
• Segment your audience for deeper insights and analysis
• Customize your typeform to make it even more personal

Are you on a Business plan or higher and interested in tracking marketing-related information like respondent source and campaign? Check out our guide to UTM tracking on Typeform here. Not on a Business plan? You can still use UTM parameters as Hidden Fields - read on to learn more!

How do Hidden Fields work?

Hidden Fields allows you to place data that you already have directly in your typeform URL. You can view all your data in the Results panel.

What types of information can be passed with Hidden Fields?

You can include any information you want, for example:

• The person’s name (so that you can use Recall information to welcome each respondent personally)
• The email of your respondent (so you know who completed the typeform)
• Traffic source (so that you know where someone saw your typeform – Facebook, website, etc)
• If you sell shoes, you can even capture the person’s shoe size (so you always have that information stored for future transactions through your typeforms)

How to add Hidden Fields to your typeform

1. Open your typeform from your workspace. On the right panel, click Logic. You can now see the Personalize with data option. Click this to go to Hidden Fields:

2. Click Hidden Fields, and a new dialog will open where you can add your Hidden Fields:

3. Click the suggested hidden fields to add them, or + Add new field to create your own, then type in what you want to call it:

Click the + Add new field button again to add more of your own Hidden Fields as required, then hit Save.

Hidden Fields must be written in lower-case letters.

4. Your Hidden Fields will be added to your typeform's share URL once you have published it. To see them, head to the Share panel:

Click Copy link, then you can paste it wherever you like. If you want to add information to the Hidden Fields manually, you can do this by pasting your link, and replacing the xxxxx with the word you want.

My Hidden Field is for tracking the source of my respondents, so I would change xxxxx to "twitter" or "facebook" for sharing on those networks.

Hidden Fields breakdown

After adding Hidden Fields to your typeform, a string of characters will be added to the URL of the typeform. Here is an example of how your URL might look with Hidden Fields added:

https://tutorials.typeform.com/to/nzthWI#name=xxxxx&source=xxxxx

In this example we are placing two parameters into two distinct Hidden Fields, these are:

• name
• source

The “xxxxx” after “name=” and “source=” are the Hidden Fields. The “xxxxx” needs to be replaced with real data in order for the typeform to pass the data into your results. You cannot currently populate score and price variables through Hidden Fields.

Using our example above, if Fran was sent their typeform through Twitter, then the URL would look like this:

https://tutorials.typeform.com/to/nzthWI#name=Fran&source=twitter

Now your typeform will automatically fill your results with the following data:

• name: fran
• source: twitter

And you won’t have to ask for their data using a question in the typeform. How cool is that?

You can pass text in the Hidden Field with a space. This can come in handy when passing, for instance, full names, like “Jane Doe”. You need to replace the spaces with “%20” in the URL in order for the Hidden Field to appear with the space in your results and/or typeform. So your URL would look like this:

https://example.typeform.com/to/AbCdEf#fullname=Jane%20Doe

And that's not all: you can encode any character using UTF-8 percent encoding.

How do you make this work?

There are 2 ways to implement this feature:

Manually – you manually add information to the Hidden Fields in the URL before sharing your typeform.

Automated – you can use your CRM system (Salesforce, Infusionsoft, Netsuite, etc.) to populate your data, so up to thousands of people can receive a custom URL Typeform. Please read these articles for more details:

• Populate Hidden Fields with a CRM / Marketing Automation tool
• Automated Hidden Fields with MailChimp

Using Hidden Fields with embedded typeforms

You can easily add a Hidden Field like “source” to a typeform that’s already embedded, but remember that this changes the URL of your typeform.

You need to paste in the new embed code you find in the Share panel and edit it manually:

Let’s say you want to track the source – where people complete your typeform. Paste the code from the Share panel into your website, then change the ‘xxxxx’ to read whatever you want, like ‘homepage’ or ‘web’, for example.

Now you’ll be able to see in your Responses how many respondents answered your typeform from your website!

You can also check out our Developer Portal for some more advanced tips on how to use Hidden Fields in embedded typeforms.

What will it look like when I collect data?

Data from Hidden Fields will appear in your Responses.

In your Responses tab, you can see each individual submission and its Hidden Field data:

Give it a shot. Copy this link, paste it in a web browser and replace the “xxxxx” with your name and an imagined source, like ‘facebook’. Then hit ‘enter’ and see what the typeform does.

https://tutorials.typeform.com/to/nzthWI#name=xxxxx&source=xxxxx

 

How to use the collected Hidden Fields information in your typeform

Apart from passing data into your results, you can do two more things with Hidden Fields:

• Add Hidden Fields to a question in your typeform. Find out how in this article: Recall information
• Use Recall information to set up Logic. Refer to this article to learn more: Use Branching and calculations in Logic to show relevant questions