Hosted Login - Dynamic Lock title?

Get Help
, ,
2

Since you are using the hosted login page, you have two options to dynamically change Lock’s title. You define the title on your code using Auth0.js or directly on the Lock.js code in the hosted login page. On both cases, you can make use of its [languageDictionary] (Lock Configuration Options) property of Lock.

To change the title using the first option, where the title is defined on your code, you should first call the hosted login page with:

var webAuth = new auth0.WebAuth({
    (...)
)};
webAuth.authorize({
    title: "Title is a title"
});

In the hosted login page, you’ll need to fetch this new property from the extraParams as:

if (config.extraParams.title) {
    languageDictionary = { title: config.extraParams.title };
}

As an alternative, you have the second option, where you put your whole logic into the hosted login page, defining the titles per client id in there. You can fetch the client id value from the config and override the languageDictionary as:

if (config.clientID === '{YOUR_CLIENT_ID}') {
    languageDictionary = {
        title: "This is a title"
    };
}

In both cases, since there is already some logic in hosted login page to properly set the languageDictionary, make sure your new languageDictionary with the title is not overridden afterwards.