📋Multi-Step Forms
Last updated
Last updated
1st form:
The first step needs to have a field to identify the user (such as 'email'). Add any other data fields you'd like to collect on the first step. Then, be sure to select the 'Redirect URL' option and paste in the link to the second step (you may need to save this form and come back and edit it once you've made the second form). At the end of the URL, add ?email={email} to ensure the email address is passed along to the next step.
Like the first step, add the 'email' field and any other data fields you'd like to collect on the second step. Then, be sure to select the 'Redirect URL' option and paste in the link to the third step (you may need to save this form and come back and edit it once you've made the third form). At the end of the URL, add ?email={email} to ensure the email address is passed along to the next step.
After you have saved your second form, click on the 'Customize Design' option for the form. On the screen that appears, we'll want to add some code to ensure that the 'email' field box becomes hidden and gets filled with the email address passed along from the first step.
Additional CSS box: .field-email{ display:none; }
Tracking code (inside <head>) box: const queryString = window.location.search; const urlParams = new URLSearchParams(queryString); const email = urlParams.get('email'); window.onload = function() { document.getElementById('email').value = email; }
Like before, add the 'email' field and any other data fields you'd like to collect on the third step. Since this is the final step, select the 'Confirmation Message' option.
After you have saved your third form, click on the 'Customize Design' option for the form. On the screen that appears, we'll want to add some code to ensure that the 'email' field box becomes hidden and gets filled with the email address passed along from the first step.
Additional CSS box: .field-email{ display:none; }
Tracking code (inside <head>) box: const queryString = window.location.search; const urlParams = new URLSearchParams(queryString); const email = urlParams.get('email'); window.onload = function() { document.getElementById('email').value = email; }
If you'd like the page to refresh after 7 seconds to the first step upon submission, add this additional piece of code - be sure to replace INSERTURLHERE with the URL to the first form!!
Tracking code (on form submission) box: setTimeout(() => { window.location.href = 'INSERTURLHERE' }, "7000");
