Kustomer.start()

👍
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
Kustomer.start();

Start chat and run a callback after chat initializes

// Start chat and run a callback after chat initializes
Kustomer.start({}, function () {
  console.log('Kustomer Chat Widget started!');
});

Start chat with options and open chat

// Start chat with options and open the chat widget

Kustomer.start({
  assistantId: 'SOME_ASSISTANT_ID'
}, function () {
  console.log('Kustomer Chat Widget started with options!');
  Kustomer.open();
});

Syntax

Kustomer.start(options, function)

Parameter Type Description

options

Object

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.

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.
`hideArticleOpenInNewTab`	Boolean	Optional Defaults to `false`. When set to `true`, the Knowledge Base Article header will not show the "open article in new tab" button.

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.

// Creates and opens a new conversation view for the user. Hides the back button in the chat UI.

Kustomer.start({ hideHistory: true }, () => {
  Kustomer.createConversation()
});