How can I add user input to the end of the redirect URL in Webflow?

To dynamically add user input to the end of a redirect URL in Webflow, you'll need to use custom JavaScript, since Webflow does not support dynamic redirect URLs natively.

1. Set Up the User Input Form

• Add a Form block from the Webflow elements panel.
• Include an input field (e.g., for a username, coupon code, or search term).
• Set a clear and unique ID or name for the field (e.g., userInput).
• Add a submit button, but leave the Form Action URL blank if you’ll use JavaScript to handle redirection.

2. Add Custom JavaScript to Handle Redirection

• Go to Page Settings or Project Settings > Custom Code, or add an Embed element at the bottom of the page.
• Insert a script that:
• Listens for form submission.
• Prevents the default submission behavior.
• Reads the user’s input.
• Redirects to the desired URL with the input appended.

Example structure (do not include <script> tags directly in Webflow answer):

• Listen for form submission using document.querySelector("form").addEventListener("submit", ...
• Extract the input value using document.getElementById("userInput").value
• Redirect using window.location.href = "https://example.com/path/" + inputValue

3. Example Use Case: Redirecting With a Query Parameter

If you want to redirect like https://yourdomain.com/result?code=USERINPUT, your redirect code will append ?code= followed by the input's value.

Make sure to URL-encode user input with encodeURIComponent(), especially if it could include special characters.

4. Placement of Custom Code

• If using the Embed element, place it at the bottom of the form section.
• If inserting the code in Page settings, go to Before tag section.

Summary

To append user input to a redirect URL in Webflow, use a standard form with a uniquely identified input field, then intercept the submission using custom JavaScript that reads the input and redirects the browser via window.location.href.