Install chat widget
Last updated
Last updated
Your script can be found under Chat widget -> Settings.
Copy the script and install it on your website using your preferred method.
Copying the script from your account will automatically include your bot ID. If you have more than one bot, make sure you have selected the correct bot when copying the script.
Name | Setting | Description |
Avatar |
| Default is a picture of Ebbot. If you choose custom it let's you upload what ever image you want. Supported images are gif, png and jpeg |
Chat bubble icon |
| Default is the ebbot chat icon If you choose custom it let's you upload what ever image you want. Supported images are gif, png and jpeg |
Color | Example | Insert the desired color code or use the built in color picker |
Placeholder text | Example: | The text that is visible in the chats input field by default |
Chat client height |
| Half takes up 60% of the screen, Tall takes up 90% |
Footer |
| Let's you toggle a small footer below the chats input field on or off. |
Chat Client Position |
| Positions the chat to the left bottom corner or the right bottom corner |
Chat client position on mobile |
| Positions the chat to the left bottom corner or the right bottom corner (for mobile only) |
Open chat automatically on page load on mobile? |
| Wether or not to auto-open the chat on page load for mobile (no is recommended) |
Allow different arrow color? |
| Yes shows the colorpicker where you can set the color: Example |
Hide chat |
| Disables the chat for everyone |
Disable pop after internal link in desktop |
| If set to yes the chat wont auto-open when you link to a page within the same domain |
Disable pop after internal link in mobile landscape |
| Same as above for but for mobile (landscape) |
Disable pop after internal link on mobile portrait |
| Same as above for but for mobile (portrait) |
Disable title and badge count for bot messages |
| Yes removes the badge that show number of unread messages |
Sounds for bot |
| Enable and disable the sound for when a new message is received from the bot |
Sounds for agent |
| Enable and disable the sound for when a new message is received from an agent (after handover to a human) |
Show agent typing on chat |
| Wether to send typing indicator or not |
Show agent avatar on chat top |
| Show the agents avatar after handover has been done (top) |
Show agent avatar on chat bubble |
| Show the agents avatar after handover has been done (with messages) |
Clear chat on tab close |
| Resets the chat if the user closes the tab (good for sensitive data) |
Chat language |
| Let you choose what language the chat should be displayed in (menus, buttons and also WCAG-support) |
Min Message Delay (ms) |
| The minimum time in ms that it will take before the message gets sent. Example: |
Max Message Delay (ms) |
| The maximum time in ms that the bot will wait before the message gets sent Example: |
Character Delay (ms) |
| How much time each character adds to the calculated time before the message gets sent. Example: |
Typing Delay (ms) |
| For how long the typing indicator is sent. Example: |
If you need even more branding possibilities our chat is fully customizable with the use of CSS.
To embed the widget on your website, modify the script and add the provided code to the relevant element in your site's structure.
Start by adding the following line of code in the script: variant: 'hero' or variant: 'embedded'.
botId and ovh lines illustrate where the variant code can be added, do not change them.
After modifying the script, insert the following code into an element with an ID on the webpage where you want the chat to appear.
That's all you need to do to embed the chat. Keep in mind that the guide won't appear as a widget on pages where the script includes the line variant: 'hero'.
