Custom login page for angular app

[satyasudakar]

I want to customize the sign up and sign in page of my angular application(version 12).

Please help.

Regards,
Sathya

[lihua.zhang]

Hi @satyasudakar ,

Welcome to the Auth0 Community!

@satyasudakar

I want to customize the sign up and sign in page of my angular application(version 12).

Please help.

We have a few FAQs related to your query. If you use the New Universal login, the following FAQs are good references for your use case.

Customizations of New Universal Login Page

Problem Statement What are the options for customizing the New Universal Login (ULP)? Solution When customizing the New Universal Login Page (ULP), there are a few configurations/options: Customize New ULP Text Prompts Customize New Universal Login Text Prompts This configuration customizes the texts displayed on the ULP, e.g. the title, description, hints, etc. Customize New ULP with No-Code Editor Customize New Universal Login with the No-Code Editor This configuration customizes …

New Universal Login Page Customization

Universal Login This document clarifies how the New Universal Login page can be customized, and provides guidance on when to use specific techniques. Customization A custom domain must be enabled for New Universal Login page customizations to work. This is one major difference between New and Classic Universal Login. Three mechanisms are available for customizing the Universal Login page. No-Code Editor: Style widgets in the New Universal Login experience to fit your brand. You can person…

If you use the Classic Universal login, please read the below FAQs.

Sample Classic Login Page Customization Scripts

Problem Statement: We can Customize the Classic Login Page with the following steps: Auth0 Dashboard → Branding → Universal Login → Settings tab, make sure “Classic” is selected and save the change. Under the Login tab, switch on “Customize Login Page” → HTML tab → Default Template, select Lock. Add scripts. Sample #1: customize the logo for each application, otherwise display a default logo Scripts: var logourl = "https://example.com/defaultlogo1.png"; //set default logo if(config.clientI…

How to configure additional signup fields on the Universal Login Page

Problem Statement Trouble configuring additional sign-up fields on the Universal Login Page. Solution When using the Universal Login Page, there are two scenarios to consider, namely the New Universal Login experience and the Classic Universal Login Experience. At the moment, the New Universal Login Experience does not support configuring additional signup fields. The New Universal Login Experience only supports progressive profiling to enrich the users’ profile, and the Signup Prompt only h…

Hopefully, those FAQs are helpful to you! If you have specific questions when customizing the sign-in and sign-up page, please provide additional details. I am happy to check further into it. Thanks!