26min

Customizing your experience

You may customize various aspects of your Hosted Experience by using any number of the following options as part of your deploy script in the uneeqInteractionsOptions section. You can do this by adding an option underneath the personaShareId: "ENTER-PERSONA-SHARE-ID-HERE", line of your deploy script.

If you are looking for a way to dynamically adjust these settings, after the session has started, you can do this by using Hosted Experience Methods

Example

JS
|





personaShareId <string>



Required Default Value: null

The unique personas share Id. This value can be found in the Creator portal, or provided to you by your customer success representative.

Example: personaShareId: "e0a935ad-f3ec-4469-af89-bf4fe6a0a246"





displayCallToAction <boolean>

Default Value: false

Should the call to action (DH preview with message) be displayed at the bottom of the page.

Example: displayCallToAction: true





position

Default Value: "right"

When using split screen layout mode, this will determine whether the left or right side of the page is used to display the digital human.

Values: "right", "left"

Example: position: "left"





renderContent

Default Value: true

Determines whether UneeQ should render content on screen. If the value is true, then UneeQ will render the content on screen when it is sent from the NLP system. When the value is false, then the content will not be rendered on screen. Using false may be desirable if you wish to render content in a different section of your website and allows you more fine tuned control. See //TODO event handling page.

Example: renderContent: false





callToActionText <string>

Default Value: "👋 Hi. Is there anything I can help you with?"

The text to be displayed inside the call to action.

Example: callToActionText: "Hello. Click here to chat with me."





cameraPosition <string>

Default Value: "CENTER"

Where the digital human should be positioned horizontally within the hosted experience frame. Camera position left/right should only be used when initiating a session in fullScreen layout mode.

Values: "right", "left" , "center"

Example: cameraPosition: "left"





customStyles <string>

Default Value: null

String of CSS to be applied to the digital human frame. Allows client to inject their own CSS styling rules and overrides. Making large changes via customStyles is discouraged as the Hosted Experience interface is subject to change. For example, the class name you might rely on for as a css selector could change without warning.

Example: customStyles: `h1 { font-size: 150%; }`





enableTransparentBackground <boolean>

Default Value: false

Whether the digital human should render a background as part of the video stream. If false, then the client may position their own background behind the digital human.

Example: enableTransparentBackground: true





errorText <string>

Default Value: "⚠ Sorry, I am busy right now. Please try again later."

Text to be displayed when the digital human cannot be started.

Example: errorText: "Oops, something went wrong, please try again later."





playWelcome <boolean>

Default Value: false

If your NLP has a 'welcome' message, then this will be triggered at session start, if this option is set to true.

Example: playWelcome: true



mobileViewWidthBreakpoint <integer>

Default Value: 900

The screen width when the layout should be switched into mobile view.

Example: mobileViewWidthBreakpoint: 0 (a value of zero would disable mobile view entirely)





layoutMode <string>

Default Value: "overlay"

Which layout mode should the session be started in. Note: the layout mode can be changed during a session by using the uneeqSetLayoutMode method.

Values: "overlay", "splitScreen", "fullScreen"

Example: layoutMode: "fullscreen"

Note: splitScreen layout mode will adjust the width of your page's <body> element to be 50% of the window width. This can produce unexpected results if your website is using CSS vw (view width) for styling.

Note: fullScreen layout mode is a beta release and is subject to change.





enableMicrophone <boolean>

Default Value: false

If true, access to the users microphone will be requested as soon as the session starts (if not accepted/declined previously).

Example: enableMicrophone: true





showUserInputInterface <boolean>

Default Value: false

If true, the voice and text input component will be shown when the session starts and does not need to be turned on during the session using uneeqSetShowUserInputInterface() method.

Example: showUserInputInterface: true





textInputPlaceholder <string>

Default Value: "Type here..."

The value provided will be used as the text input placeholder text, when displaying the user input interface.

Example: textInputPlaceholder: "Type your message"