Universal Login Page Template not working for me

Help
,
1

I am trying to customize the login page using Universal Login Page Templates. They work with the default templates. But do not work from the examples provided in the url Universal Login Pages . The preview and the site just spits out the raw text {%- auth0:head -%} {%- auth0:widget -%} . I have enabled “Customize Login Page” and also New instead of classic. Any ideas anyone why the Liquid templates are not working for me.
Thanks

2

Hi @nihilultra

Are you trying to customize the “New Universal Login Page” or the “Classic Universal Login Page”?

It looks like you are trying to customize the “New” experience. To do this, you must NOT enable “Customize Login Page”, and then update the new universal login page template via the management API for branding.

John

2 Likes
3

Hi John,
Thank you for your response. I have now selected now “New Universal Login Page” and also disabled “Customize Login Page”. I created a custom domain for the auth site and validated the DNS entry in “Custom Domains”. I just created it since I read that I need a custom domain before I can use the management apis.
In “Applications” I chose “Apis” and created a System Api and using the clientid created a JWT token by doing a POST to https://{my auth0 domain}/oauth/token.
Using the JWT token I was able to do a PUT to https://{domain}/api/v2/branding/templates/universal-login . I know it got updated since when I do a get I can see it in the response. However the page is still not getting updated. It shows the same default page. Am I missing anything else

1 Like
4

Hi @nihilultra
Try some of the examples here:

John

1 Like
5

I’m facing the same problem, in my HTML template i’m not using {% auth0:head %} and {%- auth0:widget -%},

and my template is set (I check with the api GET /api/v2/branding/templates/universal-login)

I don’t know why my template is ignored,

note: If I set my template with the UI at Customize Login Page it’s works, but I want to define it like the default template for new universal login.

why is mandatory the usage of {% auth0:head %} and {%- auth0:widget -%} for customize the login ?

6

Hi Jaime,

If you customize the ULP via the Auth0 Dashboard, you are using classic ULP. Note the yellow box at the top of the screen where you see the ULP in the Dashboard that tells you this.

In order to use the new ULP template, you must have all customization turned off in the dashboard AND have new ULP selected.

John

1 Like
7

I don’t have custom templates active in my Auth0 Dashboard, maybe I need to be more clear,

I did the steps below:

  1. I create a custom HTML page for login and put it directly on Auth0 dashboard, and it works (the yellow box was displayed, and login works in my app).
  2. I disabled it.
  3. I tried to make that HTML content the default login page for the new login experience,
    using the API management endpoint PUT /api/v2/branding/templates/universal-login.
  4. the endpoint failed, because my HTML doesn’t have {%- auth0:head -%} and {%- auth0:widget -%}
  5. I edit my HTML and put the required code commented to pass the validation.
  6. the template was accepted.
  7. I verified if the template was accepted with the endpoint GET /api/v2/branding/templates/universal-login and it was.

after setting the new ULP template, I opened my app and it is using the normal ULP page instead of my custom HTML.

so my questions are:

  1. Why do I need {%- auth0:head -%} and {%- auth0:widget -%} to define the new ULP template?
  2. Why is my custom HTML been ignored?

And thanks for you response

1 Like
8

HI Jaime,

At this point, I don’t know what is going on.

To answer your first question, see this page:

Basically, each page embeds the functionality in the widget, and the template is the wrapper for that widget.

For the problem with it not displaying, check your tenant logs, see if there is an error. Make sure you are referring to the right tenant in your app.

John

1 Like
9

If it is any help, I am having the same issue.

I cloned one of the examples (the one with the absolutely positioned footer) and pushed it up using the PUT:/branding/template/universal-login endpoint. I can pull the template back out using the same GET endpoint, so it appears to have taken.

When I authenticate against our connection/apps, I am getting the vanilla ULP render – with just our custom logo/primary color as configured in the console. Do those values affect the ability to use custom liquid templates?

For the record:

  • “New” ULP selected
  • No custom pages defined
  • Our account is using a Private Cloud instance – only mentioning it as this has bitten us before as the dashboard isn’t always “up to date” with new features
10

Fix was to make sure you are authenticating using the custom domain setup for the tenant. If you fall back to the default Auth0 provided domain for your tenant URI, it ignores your custom template and renders it vanilla.

4 Likes
11

Perfect! Glad you have figured it out!