Profile and Password Reset Form Examples

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> 
</form>

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> 
</form>

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> 
</form>

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> 
</form>