I am working on implementing a mock that requires a separate login and signup page/email for password-less. As far as I can see on the auth0 web app, there is no distinction between login and signup for the passwordless option. I am trying to:
1- customize the password-less universal login page to have 2 different versions for signup and login. (e.g. change the ‘Submit’ button text to either ‘Sign Up’ or ‘Login’)
2- create two different login and signup emails that get sent to the user. (e.g. change the email subject to either ‘welcome to AppName’ or ‘Log in to AppName’)
The first item seems doable with some css/vanilla javascript. However, I’m not sure how to go about creating the 2 separate emails. There seems to be only 1 passwordless email template in auth0, and doesn’t seem like I can change the subject/body of the email that gets sent to the user. I am using SendGrid as my email provider.
Please let me know if there is a way to create these separate emails.
Also, if there is a better way to separate the login and sigup pages besides using the passwordless template and changing it via css/javascript?
Thank you!
Yes, you are on the right track for customizing the passwordless page. Passwordless doesn’t have a default “Signup” page, but you can still customize the template by sending an extra parameter with the authorize request. In your app, this would look like this (varying syntax depending on which SDK you are using:
loginWithRedirect({ action: 'signup' });
You can customize the language dictionary and template based on this param (Auth0 dashboard > Branding > Universal Login > Login):
var action = config.extraParams.action;
var lock = new Auth0LockPasswordless(config.clientID, config.auth0Domain, {
// ... other settings
languageDictionary: {
'submitLabel': action === 'signup' ? 'Sign Up' : 'Login'
}
});
In order to achieve this, it’d likely be simplest to use your own email provider and sending the emails in a rule or action. This guide outlines how to implement custom email handling: