Skip to main content

Opening Modals with Data Attributes

Josh Lopez
Josh Lopez
  • Updated

Memberstack provides several pre-built modals that can be opened using data attributes. These modals provide a quick way to add login, signup, profile, and forgot password forms to your site.  

1) Login Modal

The login modal allows users to log into their account. To open the modal, add the data-ms-modal="login" attribute to a link or button:

<a data-ms-modal="login" href="#">Login</a>

2) Signup Modal

The signup modal allows users to create a new account. To open the modal, use data-ms-modal="signup":

<a data-ms-modal="signup" href="#">Signup</a>

3) Profile Modal

The profile modal allows logged in users to update their account. To open the modal, use data-ms-modal="profile":

<a data-ms-modal="profile" href="#">Profile</a>

4) Forgot Password Modal

The forgot password modal allows users to reset their password via email. To open the modal, use data-ms-modal="forgot-password":

<a data-ms-modal="forgot-password" href="#">Forgot Password</a>

Was this article helpful?

Didn’t find your answer?

Get an instant answer from Rey, or reach a human. Either way, we’re happy to help.

Comments

No comments yet. Start the conversation below.

Please sign in to leave a comment.

Sitemap