A URL parameter is a way to pass data in a link to a web page. You can use URL parameters to auto-populate known data from your audience like their phone number, track different metrics in services like Google Analytics or Google Ads, or even use Facebook conversion API (the new version of Facebook Pixels).

Here we will explain how to pass URL parameters using hidden form fields, capture UTM values (such as traffic mediums, sources, campaigns, etc.), and pre-fill form fields and auto-populates.

First, you need to get to the form editor page. Click on a field, and add a valid alias ID from the side menu containing the field data. The id should contain English letters and numbers with no space or other characters except underscore.

The form I used in the image below is a multi-step order form, and I wanted to discount only to a particular group of my customers.

For the sake of that, I added a short text field as a discount code to the form. Then I added an alias ID to this field.

After saving the form, I copied the URL from the pop-up and added the alias id with the desired value at the end of it.

It should be exactly like the URL parameters like the example below:

Now I can share this URL with that particular group of my customers that I wanted to give them a discount with the code of winterOff.

When they open the form, the discount field is set winterOff automatically.

Even if your form is embedded on your site, you are still able to use this feature. You need to add this parameter discount_code=winterOff to the host website URL address. like:

you can add as many alias ids as you want to your form.

Alias IDs as URL parameters work properly on all forms; widgets, multi-steps, and single-step. But we have a better approach for widgets. Adding alias ids as a prop of the widget’s script helps you manage the field values better and more efficiently.

Here is an example of a widget snippet with an alias id. On the first step, go to the share page or get the widget’s snippet from the saving pop-up on the form’s editor page.

Then add the alias ids with the format of URL parameters to alias_fields, as a new prop to widget settings.

This way helps you to use local variables and functions of the host website to set the initial values of your form’s field.

Use this guide to set the value of alias ids:

You can now use URL parameters in the Script code that you use to embed your form. On the first step, go to the share page or get the Script snippet from the saving pop-up on the form’s editor page.

Copy the code and paste it into the page where you want to embed your form.

Your Script then should look like the following:

With the power of Alias IDs, you can add hidden fields with values to your forms. It means the field won’t be displayed to the user, but the value you set for it will be submitted including the user’s answers.

This is handy for saving some additional data like the user session, the source URL of the form (like UTM), or any other info you want.

So you need to add a hidden field to your form on the form editor page.

Then add a title and alias ID to it. The rest is exactly like the way I described earlier. Just add its alias ID with its value as URL parameters to the form’s URL and share it with your users, or if it’s a widget, add it to the widget’s script.

The CSAT widget in the Formaloo dashboard is a good example of managing our users’ analytics with hidden fields.

We submit the user’s email and name along with the widget answers to improve customer support and satisfaction.

this is an example of using the widget and hidden fields with React on the Formaloo dashboard.

You can also use Hidden Fields to capture UTM or GCLID values from your formaloo form and send it to your customer data platform or the application of your choice.