defaultLanguage

  • Type: object
  • Description: Configure default language for voice interactions
defaultLanguage: {
  voice: string  // Language code (e.g., "en", "es", "fr")
}

Supported Languages

The widget supports 32 languages via ElevenLabs:
LanguageCodeLanguageCode
EnglishenPortuguesept
SpanishesRussianru
FrenchfrChinesezh
GermandeJapaneseja
ItalianitKoreanko
DutchnlArabicar
HindihiTurkishtr
PolishplSwedishsv
NorwegiannoDanishda
FinnishfiGreekel
CzechcsCroatianhr
RomanianroBulgarianbg
UkrainianukSlovaksk
HungarianhuVietnamesevi
IndonesianidMalayms
FilipinofilTamilta

Examples

Spanish Configuration

initUnifiedWidget({
  agentConfigId: "your-agent-id",
  agentKey: "your-agent-key",
  defaultLanguage: {
    voice: "es"
  },
  panelConfig: {
    title: "Bienvenido",
    description: "¿Cómo puedo ayudarte hoy?"
  }
});

Integration with i18n

// With React i18n
const userLocale = i18n.language; // "fr", "de", etc.

initUnifiedWidget({
  agentConfigId: "your-agent-id",
  agentKey: "your-agent-key",
  defaultLanguage: {
    voice: userLocale
  }
});

Dynamic Language Selection

// Based on user preference
const getUserLanguage = () => {
  return localStorage.getItem('userLanguage') || 'en';
};

initUnifiedWidget({
  agentConfigId: "your-agent-id",
  agentKey: "your-agent-key",
  defaultLanguage: {
    voice: getUserLanguage()
  }
});

Important Notes

  • Fixed Language: The language is fixed for the duration of the conversation - users cannot switch languages mid-call
  • Voice Selection: For best results, select voices specifically trained in your target language from the ElevenLabs Voice Library
  • Agent Configuration: The agent must be configured to support additional languages in the Navi dashboard
  • First Message: You can customize the first message for each language in the agent configuration

Language-Specific Customization

const getLocalizedConfig = (language) => {
  const configs = {
    en: {
      title: "Welcome",
      description: "How can I help you today?"
    },
    es: {
      title: "Bienvenido",
      description: "¿Cómo puedo ayudarte hoy?"
    },
    fr: {
      title: "Bienvenue",
      description: "Comment puis-je vous aider aujourd'hui?"
    }
  };
  return configs[language] || configs.en;
};

const userLanguage = getUserLanguage();
const localizedConfig = getLocalizedConfig(userLanguage);

initUnifiedWidget({
  agentConfigId: "your-agent-id",
  agentKey: "your-agent-key",
  defaultLanguage: {
    voice: userLanguage
  },
  panelConfig: {
    title: localizedConfig.title,
    description: localizedConfig.description
  }
});