Chat
Add Kontato Chat widget to your website with a few lines of code.
Listen to the audio to learn how it works
Quick Start
Add this code to your website before the closing </body> tag:
Basic Installation
<script>
window.kontatoSettings = {
'store-id': "YOUR_STORE_ID" // This is your real storeId
};
</script>
<script async src="https://chat.kontato.com/chat-loader.js"></script>Configuration Options
Basic Options
| Option | Type | Default | Description |
|---|---|---|---|
store-id | string | required | Your unique Kontato store identifier |
dark-mode | string | "light" | Theme mode: "light" or "dark" |
chat-closed | string | "true" | Initial state of chat widget |
full-name | string | undefined | Customer's full name |
email | string | undefined | Customer's email |
Branding Options
| Option | Type | Default | Description |
|---|---|---|---|
brand-name | string | "Kontato" | Company name shown in chat header |
brand-logo | string | undefined | URL to your company logo |
brand-background-color | string | "#0d6efd" | Header background color |
hide-kontato-brand | string | "false" | Hide "Powered by Kontato" footer |
Example Configurations
Custom Branding
window.kontatoSettings = {
'store-id': "YOUR_STORE_ID",
'brand-name': "MyCompany",
'brand-logo': "https://example.com/logo.png",
'brand-background-color': "#FF0000",
'hide-kontato-brand': "true"
};Customer Identification
window.kontatoSettings = {
'store-id': "YOUR_STORE_ID",
'full-name': "John Doe",
'email': "[email protected]",
'uuid': "unique-customer-id"
};