Universal Login with custom UI

Help
,
1

Hi Auth0 Community,

I’ve recently started using Auth0 in my project with Universal Login and it’s working great.

However, one of our new requirements is to customise the login/signup experience in multiple steps and remove the redirect to Auth0 (I’ve attached a few placeholders at the end of the post but basically it’s username validation → password creation → email verification → success).

As I currently understand, there are three options available:

  1. Customise the Universal Login page from the Auth0 dashboard using html/css (won’t work for my use case since I have multiple javascript checks I need to do, as well as involves redirecting)
  2. Use embedded login (security issues and higher upkeep)
  3. Use Classic Universal Login (no longer maintained)

I was wondering what the best practice and recommendation for this use case is.

Looking forward to your feedback,
Stefan

Placeholders:

Untitled
Untitled1920×1320 112 KB
Untitled (1)
Untitled (1)1920×1320 108 KB
Untitled (2)
Untitled (2)1920×1320 106 KB

3

Hey there @stefan6 welcome to the community!

With the requirement of not redirecting to Auth0, your only option is an embedded approach. Good to know you are aware of the potential pitfalls there - Universal Login is strongly encouraged over embedded.

4

Great, thanks for the reply. I had a follow up, Is there any guidance or example project of embedded login available? Could not find any examples

1 Like
5

No problem, happy to help where I can!

There unfortunately isn’t much in the way of samples :confused: Which technology/framework are you using client side? Happy to take a look and see what I come up with.

6

Thank you so much Ty that would be super helpful!

We are trying to implement it in Next.Js with next-auth, however using the next-auth framework is not a strong requirement for us. Any sample code would be of great help!

1 Like
7

Happ to help where I can!

I think your best option will be to use Auth0.js which is our JS library for embedded login - I can’t really speak to the feasibility of implementing it with NextJS, but the page linked above does include an example of usage.

8

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.