You can pass URL parameters to a redirect URL in Webflow by using JavaScript to capture the parameters from the current page and append them to all links or form actions dynamically.
1. Capture URL Parameters
- Use JavaScript to extract the query parameters from the current page's URL.
- Example: If the URL is
https://yourdomain.com/page?ref=123&utm=abc
, you want to get ?ref=123&utm=abc
.
2. Append Parameters to All Links
- Add a custom script in the Page Settings › Footer Code or Site Settings › Custom Code › Footer section.
- The script should:
- Loop through all
<a>
tags. - Check if the link is meant to redirect (you can filter internal vs. external links if needed).
- Append the current page’s parameters using
URLSearchParams
.
Example approach:
- Extract parameters:
window.location.search
- Loop through all links:
document.querySelectorAll('a')
- Append parameters: Conditionally update
href
if not already present.
3. Include Dropdown Selections in Redirects
- For form-based redirection, use a custom form submission handler:
- Intercept the form submit with JavaScript.
- Read the dropdown selection value.
- Combine it with the existing URL parameters.
- Redirect the user manually using
window.location.href
.
Steps:
- Use
document.querySelector('form').addEventListener('submit', function(e) { ... })
- Prevent the default Webflow form action with
e.preventDefault();
- Read the dropdown value using
document.querySelector('select[name="dropdown-name"]').value
- Append it as a new query param and redirect using
window.location.href = target + combinedParams
- If you're using Webflow's Form Redirect URL, note that it's static.
- To make that dynamic, override the redirect with custom code in the Form Submission handler as described above.
Summary
To pass URL parameters to redirect URLs in Webflow:
- Use JavaScript to extract
window.location.search
and append it to links. - Intercept and handle form submissions manually to include both URL parameters and dropdown values in the redirect.
- This ensures parameter continuity site-wide and allows email campaign tracking or user-specific navigation.