Hosting 2 Login Pages on a Single tenant
This article explains how to set up two login pages on a single tenant.
- Universal Login Page (ULP)
- Custom Domain
- Management API
- Custom HTML
It is possible to have different Universal Login pages per application.
There are different options depending on the type of Universal Login.
With New Universal Login:
Customize the New Universal Login pages by providing a page template using the Liquid template language.
- This can be done only with the Management API and requires a Custom Domain.
The page templates have a set of context variables that can be used to impact how the page is rendered. This makes it possible to implement scenarios like:
-
Render different content depending on the Application (for example, two brands need a different page design).
The relevant variables are:
-
The login page application's settings:
Here is an example with different branding per application:
<!DOCTYPE html>
<html lang="{{locale}}">
<head>
<title>Welcome to {{ application.name }} </title>
{%- auth0:head -%}
<style>
{% if application.name == "Auth0 Community" %}
#custom-prompt-logo {
background-image: url('https://cdn.auth0.com/manhattan/versions/1.3312.0/assets/badge.png');
}
{% elsif application.name == "Auth0 Dashboard" %}
#custom-prompt-logo {
background-image: url('https://cdn.auth0.com/blog/auth0rta/theme/logos/auth0-logo-black.png');
}
{% endif %}
</style>
</head>
<body class="_widget-auto-layout _use-custom-prompt-logo">
{%- auth0:widget -%}
</body>
</html>
See the following document for instructions on using the Page Template API on Customize New Universal Login Pages.
With Classic Universal Login:
Custom HTML can be used for the Classic Universal Login pages and different custom HTML can be configured per application with the PATCH /clients Management API endpoint.
This endpoint accepts the following fields in the payload:
- custom_login_page_on boolean
trueif the custom login page is to be used,falseotherwise.
- custom_login_page string
- The content (HTML, CSS, JS) of the custom login page
This makes it possible to have one setting for the entire tenant, as defined in the Dashboard, and a different one for a specific Client Application. Please review Customize Classic Universal Login Pages for more information.
