First, initialize chat fully
Kustomer Chat must finish initializing fully with `
Kustomer.start()` before you can execute any additional Web SDK methods.**Tip**: Call other methods inside the callback of `
Kustomer.start()` to ensure Kustomer Chat always completes initialization before the code tries to run other methods.To learn more, see [Troubleshooting: Kustomer method calls won't execute](πο»Ώ).
Guide: Start chat with a custom button π
Visit [Start chat with a custom button](πο»Ώ) to learn how to start and open chat with custom button.
Guide: Load chat asynchronously π
Visit [Load chat asynchronously](πο»Ώ) to learn how load chat asynchronously.
## Examples
We've provided code samples of different ways to initialize and start chat:
**Start chat**
**Start chat and run a callback after chat initializes**
**Start chat with options and open chat**
## Syntax
| Parameter | Type | Description |
| options | Object | **Required** These are options that you can pass in to modify how your chat widget loads. All possible [options](πο»Ώ) are listed below. |
| function | Function | **Optional**
A callback that is run after `Kustomer.start()` completes.
You can call other Chat SDK methods inside the callback of `Kustomer.start()` to ensure that the methods will run properly after chat completes initialization. |
### options
| Property | Type | Description |
`hideChatIcon` | Boolean | **Optional** Can be used to keep the chat icon hidden. This is useful if you want to open the widget after selecting a button or link rather than the floating chat icon. |
`brandId` | String | **Optional**
By passing in a `brandId`, you can override the default brand setting in your Kustomer Chat Settings. |
`assistantId` | String | **Optional**
By passing in an `assistantId`, you can override the default assistant setting in your Kustomer Chat Settings. |
`scheduleId` | String | **Optional**
By passing in a `scheduleId`, you can override the default schedule setting in your Kustomer Chat Settings. |
`lang` | String | **Optional**
By passing in a `lang`, you can override the users browser language. |
`hideHistory` | Boolean | **Optional**
Defaults to `false`.
When set to `true`, hides the back button and prevents the user from viewing their conversation history.
For use cases and code examples, see [hideHistory](πο»Ώ) below. |
`hideNewConversationButtonOnHistory` | Boolean | **Optional** Can be used to hide the New Conversation Button on the Conversations list view. |
`hideNewConversationButtonOnEnd` | Boolean | **Optional** Can be used to hide the New Conversation Button on the Chat Thread view after a conversation has been ended. |
`allowZoom` | Boolean | **Optional** By default, we enforce the prevention of zoom on mobile devices. This parameter can remove this enforcement, allowing host websites to utilize their own viewport meta configuration. |
`zIndex` | Number | **Optional** Defaults to 2147483647 Can be used to specify a stack order for the Chat Widget in relation to other elements on the page. |
`chatIconSize` | Number (pixels),
String in the format '00px',
Object matching
`{
height:0,
width:0
}` | **Optional** Defaults to 50 Can be used to specify the size of a custom icon for the chat widget. |
`chatIconPosition` | "right", "left", or an
Object matching
`{
alignment: 'right' | 'left',
verticalPadding: number of pixels to pad from bottom
width: number of pixels to pad from right or left
}` | **Optional** Can be used to specify the position of the icon that launches the chat widget on the page. |
`preferredView` | `"chat"` or `"kb"` | **Optional**
Defaults to
`"kb"` and shows the Knowledge Base the first time the widget is opened. Setting as `"chat"` will default to chat instead.
If only one experience (Chat _or_ Knowledge Base) is enabled in chat settings, this option will have no effect |
`showTitleNotifications` | Boolean | **Optional** Can be used to enable adding the number of unread chat messages to the tab/window title when the tab/window is not in focus. |
`showBrowserNotifications` | Boolean | **Optional**
Defaults to `true`.When set to `true`, turns on browser notifications for newly received messages when chat is minimized or the page with chat is not in focus. |
### hideHistory
You can set the `hideHistory` parameter to `true` to prevent a user from viewing their conversation history list entirely. If you do not specify a value, `hideHistory` defaults to `false`.
**Use case**
Set the `hideHistory` parameter to `true` for cases when you want to:
Open the chat widget directly to a conversation using either [Kustomer.openConversationById()](πο»Ώ) or [Kustomer.createConversation()](πο»Ώ).
**and**
Prevent the user from going back to the full conversation list with their entire conversation history.
We've provided a code sample below.