In this tutorial, we will create a forgotten password flow in Webflow.
You can also manually reset a member's password in the dashboard.
Page 1 - Forgot Password
Create a new page called Forgot Password.
Add a form element and assign it a data attribute of
Add an email field with the attribute
Next, set the form redirect to something like
Duplicate your Forgot Password page and make sure the slug matches the redirect you set in the previous step.
- This form with trigger an email with a 6-digit code. Check out this other guide to customize the reset email.
Page 2 - Reset Password
On your new page, give the form an attribute of
Add a text input labeled “Reset code” and give it a data attribute of
Add a type password input with a data attribute of
- Set the form redirect to something like
Page 3 - Success
Create new page with the same name/slug you used in the previous step.
Add some page content to let the member know their password was reset successfully.
Add a button that links back to your login page.
⚠️ Once a member creates a new password they will still need to log in.
Forgot password, change password, reset password, new password, etc.