In this article, you will learn how to send the information captured through a form on your landing page to the URL your visitors are redirected to.
1. Create your form and redirect it to the outside URL;
2. Add the following code in Settings > Javascript, footer section of your landing page:
3. Replace the first three pieces of highlighted text in the image below with the names of your own form fields and the last three with the names of the parameters you want to have in the URL. The last three do not have to match the names of the fields, these are the parameters you want to use in the URL.
Note: The code above doesn't work for sending parameters through Text Area, Radio Button, Checkbox, and Dropdown field types.
If you also want to pass parameters appended to the URL, not only the ones related to the visitor submitting the form, you can enable the Pass URL param toggle as seen here: https://d.pr/l5NzMf.
Using the passed parameters on the destination page
Passing parameters through the URL in this way can be used in multiple ways. One of the most likely uses that we see with our customers is capturing the values of the parameters on the second page to be stored or displayed.
You can use URL parameters on your Instapage landing page in two ways: first, as text on the page, and second, by capturing them in hidden fields in a form. Both of these use the built-in feature of Dynamic Text Replacement.
Please note that DTR is only available to some of our subscriptions. More information about our currently available subscriptions can be found here: https://instapage.com/plans
1. Using URL parameters as text on the page
Type the name of the parameter in between square brackets in the body of the text on your page.
Example:
- The parameters in the URL are ?firstname=John&lastname=Doe
- You type the following in the page editor: "Welcome [firstname] [lastname]! We can provide the best solution for the [lastname] family."
- The text on the live page displays: "Welcome John Doe! We can provide the best solution for the Doe family."
2. Capturing URL parameters in a hidden field
Type the name of the parameter between square brackets in the Input section of the hidden field when creating/editing the form.
Example:
- The parameters in the URL are ?firstname=John&lastname=Doe
- You create a hidden field called with the label Name and the input [firstname] [lastname]
- When someone submits the form the value "John Doe" will show up for the hidden field Name in your leads.
- Depending on how you intend to use the data, you may use a single parameter per hidden field (as shown in the screenshot below) or add several parameters to the same field, as shown in the current example.
For more in-depth information about Dynamic Text replacement, please consult the dedicated guide here: https://d.pr/c6Yyy6
In case you need help with custom functionality or any code customization that is not provided through our Help Center articles, we have a Professional Services team that can help our Convert users. The Convert plan includes Professional Services as well as additional features and services that can be seen here: https://instapage.com/convert-benefits.