← Alle functies

Wachtwoord Reset Modaal

Wachtwoord Reset Modaal

Wachtwoord Reset Modaal
Who uses Memberstack?

Used by 50,000 Teams & Agencies

Memberstack wordt elke dag door miljoenen mensen gebruikt.

Onderdelen

Begin met een gratis onderdeel

Het uitproberen van Memberstack functies is net zo eenvoudig als het kopiëren en plakken van een van onze meer dan 600 gratis Webflow componenten!

Alle onderdelen bekijken

Primaire voordelen

Better User Experience

Allow your members to easily recover their account access without needing to contact customer support or create a new account.

Minimise Manual Customer Support

Reduces the need for manual user support in password recovery cases.

How to Create a Password Reset Modal

Documenten bekijken

Follow the instructions to create 3 fully customizable pages in Webflow or clone a project which already has password reset functionality. Check out this tutorial to customize the actual reset email.

You can also manually reset a member's password in the dashboard.

password-reset.gif

Page 1 - Forgot Password

1. Create a new page called Forgot Password.

forgotpasswordpage.jpg

2. Add a form element and assign it a data attribute of data-ms-form="forgot-password".

forgot_password_attributes.jpg

3. Add an email field with the attribute data-ms-member="email"

Screen_Shot_2022-08-02_at_12.13.46_PM.jpg

4. Next, set the form redirect to something like /password/reset or /reset-password.

5. Duplicate your Forgot Password page and make sure the slug matches the redirect you set in the previous step.

Screen_Shot_2022-08-02_at_12.15.31_PM.jpg

6. 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

1. On your new page, give the form an attribute of data-ms-form="reset-password".

Screen_Shot_2022-08-02_at_12.17.30_PM.jpg

2. Add a text input labeled “Reset code” and give it a data attribute of data-ms-member="token" .

Screen_Shot_2022-08-02_at_12.18.30_PM.jpg

3. Add a type password input with a data attribute of data-ms-member="password".

Screen_Shot_2022-08-02_at_12.26.20_PM.jpg

4. Set the form redirect to something like /password/success or /password-set.

Page 3 - Success

  1. Create new page with the same name/slug you used in the previous step.
  2. Add some page content to let the member know their password was reset successfully.
  3. Add a button that links back to your login page.

⚠️ Once a member creates a new password they will still need to log in.

Screen_Shot_2022-08-02_at_12.38.15_PM.jpg
Slack

Meer weten over Memberstack? Word lid van onze 5.500+ leden tellende Slack community!

Word lid van de Memberstack community Slack en stel uw vragen! Verwacht een snel antwoord van een teamlid, een Memberstack expert of een mede-communitylid.

Word lid van onze Slack

Bekijk alle functies →

Bouwen

Begin met het bouwen van je dromen

Memberstack is 100% gratis totdat u klaar bent om te lanceren - dus waar wacht u nog op? Maak je eerste app en begin vandaag nog.