You can change the default colors used in the application by setting de primary and secondary colors.

You can customize the color for the main background by setting the "backgroundColor" attribute of the configuration object.

The colors configuration are being set in the "theme" attribute of the configuration object.

Specific configuration parameters

Parameter	Description
theme.primaryColor	Color value in Hex
theme.secondaryColor	Color value in Hex
backgroundColor	Color value in Hex. Default color #F0F2F5

You can change the font family used in the application by setting the fontFamily parameter

📘
Font Availability
Beware to have the font family already available on the main site where you are injecting the widget

Specific configuration parameters

Parameter	Description
theme.fontFamily	The name of the font already installed in the main site

The parameter "language" allows configuring the displaying locales on the application

Supported Locales

👍
Supported Languages
We Follow the ISO 639-1 standard language codes
es: Spanish (Spain)
en: English
pt: Portuguese (Portugal)
pt-br: Portuguese (Brazil)

Specific configuration parameters

Parameter	Description
language	language code of the supported language. Default: Browser \|\| "en"

You can change the display of the currency type, show or hide the decimals in order and decide if the thousand separator is comma or by default.

Parameter	Description
currencyCode	Set the currency code (optional) Default: Established when creating the order
pricesSeparetedByComma	Allows you to decide if the thousand separator is comma or by default it is kept in point default: "false" options: "true" or "false"
hideElements.decimals	Allows you to show or hide the decimals in order default: "false" options: "true" or "false"
decimalsLength	Allows to define the number of decimals to show default: "2"

With the Active Tabs parameter, you can control what you want to display in the content of the application

You may decide to display only a set of the information available from the order, or even to display the chat when using the application.

We currently support 3 modes in which you can display information

With the Full screen parameter allows you to adjust the margins

👍
Display Modes

Chat Tab

State Tab

Detail Tab

Full screen

Specific configuration parameters

Parameter

Description

activeTabs

allows you to control what content to present in the application

*chatTab**: with this value, we will display only the chat view in the application.
*detailTab: this will display information details related to the order, like items list and billing summary, butnot** information regarding the current status/steps the order is at the moment
- stateTab**: this will display information about the status/steps the order is undertaking.

isFullScreen

It allows you to decide if the screen will be full screen
default: "false".
options: "true" or "false