Documentation

Multi-Language Support

UserView supports custom translations for all user-facing text. You can set these during initialization based on the user's language preference.

Basic Translation Setup

Pass translation strings directly to the init function:

Upscope("init", {
  authorizationPromptTitle: "Co-Browsing request",
  authorizationPromptMessage: "Would you like to let {%agentName%|our agent} co-browse with you?",
  translationsYes: "Yes",
  translationsNo: "No",
});

Language Detection Example

Here's a complete example that automatically selects translations based on the user's browser language:

const translations = {
  en: {
    authorizationPromptTitle: "Co-Browsing request",
    authorizationPromptMessage: "Would you like to let {%agentName%|our agent} co-browse with you?",
    translationsYes: "Yes",
    translationsNo: "No",
  },
  fr: {
    authorizationPromptTitle: "Demande de co-navigation",
    authorizationPromptMessage: "Souhaitez-vous permettre à {%agentName%|notre agent} de co-naviguer avec vous ?",
    translationsYes: "Oui",
    translationsNo: "Non",
  },
  es: {
    authorizationPromptTitle: "Solicitud de co-navegación",
    authorizationPromptMessage: "¿Le gustaría permitir que {%agentName%|nuestro agente} co-navegue con usted?",
    translationsYes: "Sí",
    translationsNo: "No",
  }
};

Upscope("init", {
  ...(translations[navigator.language.split('-')[0]] || translations.en)
});

This detects the browser's language using navigator.language, extracts the language code (e.g., en from en-US), and falls back to English if the language isn't available.

Available Translation Keys

See the Messages section of Configuration Options for a complete list of translatable strings.