You can use the Hidden form field in Form Blocks to build URLs to track referral sources. It does this by passing a query parameter through the form on your site.
Follow the steps in this guide to set up your form, create your referral URLs, and track referral sources.
Set up the form
To add a Form Block with a hidden field:
- Edit a page or post, click an insert point, and click Form in the menu.
- In the Content tab, click Edit Form Fields, then click Add Field.
- Click Hidden in the menu to add it to your form, then click Hidden in your form's field list to customize the hidden field.
This hidden field won't be visible to visitors on your site.
Tip: By default, the Form Block will include Form Fields for Name, Email Address, Subject, and Message. For more information on setting up the Form Block you can check out our guide here.
Customize the hidden field
Edit the Label of the Hidden form field. This will automatically a variable below beginning with SQF_. For example, if you use the label Source, your variable will be SQF_SOURCE.
This is the variable you'll use in your page's URL when you share the URL through different media.
Tip: Use a single-word variable for best results, especially if you're using Google Drive or Mailchimp as your storage service. Variables with multiple words or characters may not properly move your data.
The text you add to the Value field is the default information that will be sent through the form when the variable is not available. This happens when someone finds the form by visiting your site directly.
Save your changes
When you're finished creating your form (don't forget to add storage), click Save on the page.
Share your page
To track Form Block referral sources, you need to share URLs to your site that include the variable from your hidden field and the information you want to pass to the field in your form storage.
Put simply, you need to add custom text to the end of your site's URL when you share it. This is called a query string.
Use the following format:
- <field-title> is the variable name (or label) assigned to your hidden form field
- <value> is the data you wish to pass to the field.
Continuing with our example from above, our query strings will all begin with:
The <value> that comes after the equal sign is up to you.
For example, you might use:
- /?SQF_SOURCE=facebook for URLs you share on Facebook
- /?SQF_SOURCE=twitter for URLs you share on Twitter
This way, you can identify forms filled out by users who clicked the URL on Facebook and Twitter respectively.
You don't need to use "facebook" and "twitter" as your values, even if you're tracking Facebook and Twitter campaigns. They can be anything you want. Animals, colors, numbers, or even strings of random letters and numbers.
Note: Values passed must be 100 characters or fewer.
I have a website, awesomerestaurantsinc.squarespace.com. On my homepage, I have a signup form for my newsletter. I'm sharing this signup page using three campaigns:
- One on Facebook
- Another on Twitter
- A third on Google Ads
I'll use the hidden field to track signups from each campaign.
On Facebook, I'll share this URL:
On Twitter, I'll share this URL:
On Google Ads, I'll share this URL:
I manually added the values facebook, twitter, and google-ads. When someone submits a form after clicking a link I shared, facebook, twitter, or google-ads will record in the Source column for that form submission. This way, I can easily see which campaign attracted each subscriber.
If I wanted to hide that I was tracking sources (from more savvy users), I could rename my hidden field to something like dragons and then use the values apple, orange, and lime. As long as I know what the values refer to, they can be whatever I want them to be. In this example, my URLs would look like http://awesomerestaurantsinc.squarespace.com/contact-us/?SQF_DRAGONS=apple
Tip: You can use your internal domain or your custom domain when creating these links. If my website had a custom domain, I could share http://awesomerestaurantsinc.com/contact-us/?SQF_SOURCE=FACEBOOK
Test the Form Block (optional)
To test the hidden field, you'll need to log out of your site. After you're logged out, enter the URL for the page and manually add the field and value in the complete query string.
If I'd like to test my query string for Twitter, I'd log out of my site and go to the following URL:
I can now submit a form to verify that the hidden field is working as intended.
Tip: As an alternative to logging out, you can visit the URL in an private browser window. Use an incognito window in Google Chrome or private browsing in Firefox and Safari.
Viewing source data
To view the referral sources, open the storage services connected to your Form Block. In our examples, the information appears with the label Source, but this varies depending on how you label your hidden field.
The hidden field information appears in email submissions next to Source.
The hidden field information appears in the Source column in Google Drive.
The hidden field information appears in the Source column in Mailchimp.
If someone completed your Form without going through one of these links, then Source appears with your default value (or blank, if you left it blank). In our example, we changed our default value to Direct from website.
Tip: With a paid Mailchimp account, you can create conditional customized autoreply emails so subscribers from different sources can receive different messages upon subscribing. Learn more in Mailchimp's Help Center.
Using multiple hidden fields
If you're using more than one hidden field, use an ampersand (&) to separate the fields.
For example, to track the progress of my three campaigns from month to month, I could add a second hidden field with the title "MONTH."
My URLs would then look like this:
- <value-1> is the value that relates to SOURCE (facebook, twitter, google-ads)
- <value-2> is the value that relates to MONTH (january, february, march, and so on through the year)