Help Centre
How can we help?
Search Docs
When building forms in Framer, have you ever needed to send additional data along with form responses (like CMS fields, variables, or URL parameters)? You’re in luck, because FramerForms makes it easy with hidden fields!
You can find hidden fields in the FramerForms dashboard at the bottom. There are 4 types of hidden fields:
UTM tags
Referrer URL
URL parameter
Current URL
Let’s take a look at each hidden field type and how you can use them:
UTM Tags
This type of hidden field allows you to send the UTM tracking tag of a campaign or URL to your form destination, allowing you to see which campaign directed traffic to your website.
Referrer URL
The page’s referrer URL is the URL of the website that the user navigated to your site from. For example, if someone clicked on a link on insertframe.io to your website, the referrer URL is “insertframe.io”. With this type of hidden field, you can include the referrer URL in form responses.
URL Parameter
A URL parameter is a part at the end of the URL after a ? symbol. For example, if the URL is “framerforms.com/?id=123&type=House”, the URL parameters are “id” and “type”, with values of “123” and “House”. This hidden field type passes the value of a specific URL parameter or nothing if it doesn’t exist in the page URL.
Current URL
This hidden field type adds the current page URL to form submissions as a separate field, which is useful if the same form is included on multiple pages.
Example use case: a contact form is in your website’s footer which is included on every page of the website. A hidden field for the current URL tells you which page each submission came from, even though they are the same form.
Editing hidden fields
When you copy and paste a hidden field component into your Framer project, the first thing you’ll notice is that it’s… not hidden! That’s intentional - in the editor hidden fields display as a rectangle with a label showing the type of hidden field so you’re able to find them easily. But when you preview your project or visit the live website, hidden fields are invisible.
Once you’ve added hidden fields and configured them to the data you need, fill out your form once to test that it was set up correctly. You should see the hidden field along with all other fields in the form submission!
