Configuration

Customize your agent’s appearance, behavior, and functionality by setting the properties below. These options allow you to control everything from logos and themes to layout and audio features.

Property	Type	Required?	Description
displayName	string	No	The agent’s display name
logoUrl	string	No	URL for the agent’s primary logo.
modalLogoUrl	string	No	URL for the logo used within modals or dialogs.
titleText	string	No	The main heading displayed in the agent panel.
quickStartHint	string	No	Instructional text guiding users on quick-start actions.
quickReplies	Array<{ title: string; subtitle?: string }>	No	A list of preset buttons to kick off common conversations.
theme	<see Theme Properties below>	No	Color, font and bubble styling options
isLogoVisible	boolean	No	Toggle to show or hide the agent’s logo.
isLTR	boolean	No	Text direction: left-to-right (true) or right-to-left (false).
isAudioEnabled	boolean	No	Allow users to send voice input instead of typing.
resumePreviousSession	boolean	No	Automatically reload the last session if the previous interaction was within 24 hours.

Theme Properties

Property	Type	Required?	Description
primaryColor	string	No	Brand or primary color
secondaryColor	string	No	Secondary color
primaryFontColor	string	No	Primary text color
secondaryFontColor	string	No	Secondary text color
backgroundColor	string	No	Widget background color
speechBubble	string	No	Speech-bubble color
speechBubbleText	string	No	Text color inside speech-bubbles
widgetBubbleBackgroundColor	string	No	Bubble handle backgroundColor (this property apply only mode "OVERLAY" & layoutMode "WIDGET")
fontFamily	string	No	UI font family

You can also configure all of these settings in our Studio. Note that any SDK-side configuration will override the Studio values—allowing you to vary settings on a per-page or contextual basis.

Example

JavaScript

eucera("when", "ready", () => {
  eucera.agent({
    apiName: AGENT_API_NAME, 
    mode: "EMBEDDED", 
    configuration: {
      // UI text & icons
      displayName:       "Support Bot",
      logoUrl:           "https://example.com/logo.png",
      modalLogoUrl:      "https://example.com/modal-logo.png",
      titleText:         "How can I help you today?",
      quickStartHint:    "Try one of these quick commands:",
      quickReplies: [
        { title: "Show me features",    subtitle: "What this bot can do" },
        { title: "Contact support",     subtitle: "Talk to a human" }
      ],

      // Theme & styling
      theme: {
        primaryColor:                "#0055FF",
        secondaryColor:              "#FF5500",
        primaryFontColor:            "#FFFFFF",
        secondaryFontColor:          "#333333",
        backgroundColor:             "#F4F4F4",
        speechBubble:                "#E0E0E0",
        speechBubbleText:            "#000000",
        widgetBubbleBackgroundColor: "#FF0000",
        fontFamily:                  "Arial, sans-serif"
      },

      // Feature toggles
      isLogoVisible:         true,
      isLTR:                 true,
      isAudioEnabled:        false,
      resumePreviousSession: true,
    }
  });
});

Configuration at Runtime

Update any part of the AgentConfiguration after initialization—logos, theme, quick replies, etc.

JavaScript

eucera("when", "ready", () => {
  const agent = eucera.agent({ /* …common setup… */ });
  agent.setConfiguration({
    displayName: "Support Bot",
    logoUrl: "https://cdn.example.com/logo.png",
    theme: { /* … */ }
  });
});