Webflow sync, pageviews & more.
NEW
Answers

How can I prefill a form field with information from the URL in Webflow, specifically for unsubscribes using a passed email, so that the user only needs to click the submit button?

To prefill a form field with information from the URL in Webflow, you can use JavaScript code in combination with query parameters. Specifically for your case of unsubscribes using a passed email, you can follow these steps:

1. Add a regular form field to your Webflow form. Give it a unique ID or class name that you can later reference in your JavaScript code.

2. Add a query parameter to your unsubscribe URL to pass the email value. For example, if your unsubscribe link is `https://www.example.com/unsubscribe?email=test@example.com`, the query parameter is `?email=test@example.com`.

3. Open the page where you have placed your form in the Webflow Designer. Go to the page's Settings panel, and under the Custom Code tab, paste the following JavaScript code:

```javascript

```
Make sure to replace `'your-email-field'` in the code with the actual ID or class name of the form field where you want to prefill the email.

4. Publish your Webflow site, and when a user clicks on an unsubscribe link with the email query parameter, the form field will be automatically filled with the passed email address. The user can then simply click the submit button to complete the unsubscribe process.

This JavaScript code uses the `getQueryParameter` function to get the value of the `email` query parameter from the URL. It then assigns the value to the form field specified by its ID or class name using JavaScript's `getElementById` or `document.querySelector` method. The `prefillEmail` function is called when the page finishes loading using the `window.addEventListener` method.

Rate this answer

Other Webflow Questions