| chatSrc * | string | URL: https://webchat.**ENV**.chatbots.sentione.com/fullscreen | https://webchat.pre-stage.chatbots.sentione.com/fullscreen |
| projectId * | string | Project id | |
| appearance | object | Object to set up appearance of the webchat | appearance: {
headerTitle: "Sentione chat",
avatar: {
src: '<https://cdn.sentione.com/chat-ui-launcher/avatars/avatar-male.png>
',
showNearBubble: true,
showInHeader: false,
},
},
|
| appearance.headerTitle | string | User will see it in header | |
| appearance.avatar | object | Object to config avatar | src: '<https://cdn.sentione.com/chat-ui-launcher/avatars/avatar-male.png>
',
showNearBubble: true,
showInHeader: false,
},
|
| appearance.avatar.src | string | Url to custom avatar | |
| appearance.avatar.showNearBubble | boolean | Display setting of the avatar near to message bubble | |
| appearance.avatar.showInHeader | boolean | Display setting of the avatar in chat header | |
| appearance.inputPlaceholder | string | Placeholder of the input | inputPlaceholder: "Type something...", |
| appearance.styles | object | Object to setup custom styles of webchat |
', themeColor: 'red' }```
|
| appearance.styles.url | string | Url to custom stylesheet | |
| appearance.styles.customCss | string | Custom css rules | styles: { customCss: '.chat-header__title {color: red;}', } |
| appearance.styles.themeColor | string | Main color of webchat | styles: { themeColor: 'red', } |
| autoStart | object or number | Field to setup auto open chat behavior.
- no field or -1 - chat will stay closed until user click to open manually
- 0 - chat will open automatically
- above 0 - chat will open after defined time
| autoStart: {
delayTime: 2000,
},
```or
`autoStart: 2000`
|
| autoStart.delayTime | number | Time to delay automatically open chat | autoStart: 2000 |
| author | string | Name of the user, this value will be visible in Conversation analytics | |
| sessionId | string | Field to continue already started conversation | |
| sourceType | string | Field to mark conversation with custom source name. Value will be visible in conversation analytics | |
| initialMessage | object | Object to set up initial message. Thanks to it, bot can start from specific block | text: "",
extraData: { process: "process_name" },
},
```
|
| initialMessage.text | string | Initial message that will be sent to bot to start conversation | text: Say hello" |
| initialMessage.extraData | object | Initial extraData that will be sent to bot to start conversation | extraData: { process: "process_name" } |
| onOpenChat | function | Callback function | console.log('Chat is open');
}```
|
| onCloseChat | function | Callback function | console.log('Chat is closed');
}```
|
| onInitializedChat | function | Callback function | console.log('Chat is initialized');
}```
|
| onOpeningButtonClick | function | Callback function | console.log('User clicked to open chat');
}```
|
| onMessageSent | function | Callback function called after send Message by user | console.log('User send:' + userMessage);
}```
|
| onMessageReceived | function | Callback function called after send Message by user | onMessageReceived: (messageReceived) => { console.log('Bot said:' + messageReceived.responses[0].text); } |