Change language of password reset custom page in Classic experience

Knowledge Solutions
1

Problem statement

Set up a custom language dictionary for the password reset page edited from the Dashboard Advanced options (Classic experience override).

Symptoms

The password reset page is displayed in English and not the desired language.

Solution

You can use the “lang” custom variable which will take the Accept-Language HTTP header value, yet this will be according to the end-user’s browser configuration. If you want to override the language in a more customizable way, here’s the workaround:

  1. Have the user’s metadata with the desired info (e.g. “lang”: “ja” for Japanese)
  2. Change the email template <a href="{{ url }}> for <a href="{{ url }}{{user.user_metadata.lang}}">
  3. Change the JS in the password reset custom page as follows:
let lang = document.location.hash.slice(1);

    /**
    Example of fallback to US if no translations found for language
     */   
    const dict = translations.hasOwnProperty(lang) ? translations[lang] : translations['en-US']; 
    

    new Auth0ChangePassword({
      ...
      dict,
    });

This procedure sends the user’s metadata via the link in the change password email template and delivers the information to the Classic password reset page.

References: