Memberstack offers several data attributes to handle social authentication with providers like Google, Facebook, LinkedIn, etc. These attributes allow you to add social login, connect/disconnect buttons, and conditionally show content based on a connected provider.
Important Note: If your members only have a single social auth provider connect and do not have a password assigned the member you will get an error that says "Please set a password before disconnecting your last provider". This is a failsafe so members will be able to log back in.
data-ms-auth-provider
This attribute adds a social login button in your signup and login forms. It must be used inside the data-ms-form="signup" or data-ms-form="login" elements.
<a data-ms-auth-provider="google" href="#">
Continue with Google
</a>
data-ms-auth
This attribute creates a container to manage connecting/disconnecting providers. It must wrap data-ms-auth-provider elements.
<div data-ms-auth="manage-providers">
<a data-ms-auth-provider="google" href="#">
Continue with Google
</a>
</div>
data-ms-auth-connected-text
This attribute allows you to change the text of an element if a provider is connected. It must be inside data-ms-auth="manage-providers".
<div data-ms-auth-connected-text="Disconnect Google">
Connect Google
</div>
data-ms-auth-disconnect
This attribute shows a child element like an X icon if the provider is connected. It must be inside data-ms-auth-provider.
<div data-ms-auth-provider="google">
<div data-ms-auth-disconnect>
<img src="x-icon.png">
</div>
Connect Google
</div>
Using these attributes together allows you to create a social authentication flow in Memberstack. See the documentation for more details on setup and usage.
Memberstack offers several data attributes to handle authentication with email/password or social providers like Google, Facebook, etc.
Regular Email/Password
For standard email and password authentication, use the data-ms-form attributes in your signup and login forms found here.
Comments
2 comments
If I am using data-ms-auth-provider="google" in a sign up form, how can I override the email verification redirect so that it either:
1. Logs in immediately
2. or at least take user to the Log In page instead of the Verification Required page
hey Musab Dali
If the member has verified their email with google then they are auto verified. If you would like us to assume the member using google is verified we can over ride and make all google users verified. We would need to know your app id to enable this.
Please sign in to leave a comment.