Profile and Password Reset Form Examples

Article author
Josh Lopez
  • Updated

Here are some examples for creating full profile update forms, change email forms, change password forms, and password reset forms in Webflow using Memberstack.

Profile Update Form

A profile form allows members to update their custom field data. Add the form tag with data-ms-form="profile" and inputs for each custom field using data-ms-member="CUSTOM_FIELD_ID".

<form data-ms-form="profile"> 
  <input type="text" data-ms-member="firstName"> 
  <input type="text" data-ms-member="lastName"> 
  <button type="submit">Update Profile</button> 

Change Email Form

To allow members to change their email, add the form tag with data-ms-form="email" and an input for email using data-ms-member="email".

<form data-ms-form="email"> 
  <input type="email" data-ms-member="email"> 
  <button type="submit">Update Email</button> 

Change Password Form

The change password form requires the current password and new password. Use data-ms-form="password" on the form, and data-ms-member="current-password" and data-ms-member="new-password" on the inputs.

<form data-ms-form="password"> 
  <input type="password" data-ms-member="current-password"> 
  <input type="password" data-ms-member="new-password"> 
  <button type="submit">Change Password</button> 

Password Reset Form

The password reset form requires the token from the forgot password email and new password input. Use data-ms-form="reset-password" on the form, data-ms-member="token" for the token input, and data-ms-member="password" for the new password.

<form data-ms-form="reset-password"> 
  <input type="text" data-ms-member="token"> 
  <input type="password" data-ms-member="password"> 
  <button type="submit">Reset Password</button> 

Was this article helpful?



Please sign in to leave a comment.