/
Kite Website widget configuration

Kite Website widget configuration

This guide explains how to configure Kite website widget for x-bees and Collaboration 7.

Other documentation: x-bees documentation, Collaboration 7 Documentation.

Created: June 2022

Updated: February 2026

Permalink: https://wildix.atlassian.net/wiki/x/MhTOAQ

Introduction

Kite widget is a professional solution for business communication based on the WebRTC technology that brings Unified Communications to the corporate website. Using the widget, website visitors can communicate with agents via chat, video conference, share data, all in just a few clicks. And the chat requests from website visitors are easily managed by PBX users via x-bees / Collaboration 7 interface.

Supported features:

  • Chat

  • Video conference

  • Desktop sharing

  • File exchange

Requirements

  • For x-bees:

    • Min. supported WMS version: 6.01.20220621.2 and higher

    • Subscription plan: x-bees-Standard or higher to be website widget agent

  • For Collaboration 7:

    • Min. supported WMS version: 7.01 and higher

    • Subscription plan: UC-Business or higher to be an agent of website widget

  • Browser compatibility: Google Chrome

Notes:

  • We recommend using the latest stable browser version

  • Full support for Mozilla Firefox and Safari is coming soon

Limitations: website widget doesn't work if browser is in Incognito mode. 

  • Make sure that these external servers and ports are open on your router/ Firewall:

    • https://app.x-bees.com/

    • https://app.wildix.com/

    • https://api.x-bees.com/

    • https://login.x-bees.com/

    • https://chat.wildix-chat.com/

    • https://conference.wildix.com/

    • https://auth.wildix.com/

    • https://fs.wildix.com/

    • https://avatars.wildix.com/

    • https://cognito-idp.eu-central-1.amazonaws.com/

Configuration

Configuration website widget consists of two steps:

  • Creating website widget – done by PBX admin 

  • Implementation on the website – carried out by website webmaster

Create Kite website widget

  1. Go to WMS -> PBX -> Integrations -> Cloud integrations

  2. In the Channels section, choose Kite:

pbx-integrations-kite.png

  1. Click Add new widget:

add-new-widget-button.png

  1. Enter Widget name and fill out Appearance Settings section. It is the content that will be displayed on the widget's Welcome screen:

  • Title: Enter agent name

  • Header title: enter title to be displayed on your website widget, e.g. Hello

  • Header subtitle: type subtitle for your widget header, e.g. How can we help you?

  • Button title: enter text to be displayed on the button e.g. Start new conversation

widget-appearance-settings.png

  1. In Palette Settings section you can choose the widget background color. To choose color, click Change: 

widget-palette-settings.png

  1. Choose the preferred color for your widget:

If you want to reset color to default, click Reset:

reset-color.png

Notes:

  • The custom color is applied for the widget background and buttons.

  • For conversation, the default blue color is used.

  1. If you wish to align widget availability with your business working hours, click on Working Hours Settings section and press Add rule: 

working-hours-add-rule.png

  1. Set your business hours: 

select-business-hours.png

If needed, you can set multiple rules:

 

  1. In Routing Settings, you can choose whether you want to route incoming conversations to an agent, service (corresponds with a Call group) or a bot (needs to be configured beforehand, see the documentation How to configure AI Chat Agents)

widget-routing-settings.jpg

Note: An agent who has never logged into x-bees / Collaboration 7, is not displayed as Kite agent (either as a member of a group of agents or individually)

  1. If you wish to welcome customers with a predefined message, proceed to the Welcome Messages Settings and click Add message:  

welcome-messages-add-message.png

  1. Enter the text of the message and choose when it should be displayed, immediately or after 1-5 seconds:

enter-message-choose-when-should-be-displayed.png

Note: It is possible to add up to 10 welcome messages.

You can also add quick replies:

add-quick-replies.png

  1. If you want to set predefined actions which are triggered in some conditions (e.g. in case there is no reply, message was not read), click Add Action in the Actions section:  

add-action.png

  1. On the Add a new Action screen, choose the necessary condition:

  • No reply: action is triggered if no agent replies within a defined time (from 5 seconds to 1 day)

  • Not read: action is performed if no one reads the message within a specified interval

  • No activity: action is triggered if there’s no chat activity (no messages from user or agent) for the predefined duration of time

add-new-action-choose-conditions.png

  1. Then, choose an action. There are two types of available actions: 

  • Send message: allows to send a predefined message (e.g., "All agents are currently unavailable, we’ll get back to you later.") if the condition is met 
    For this type of action, you need to choose the Bot to perform the action. 

actions-send-message.png

  • Add members: adds participants to the conversation. Choose member(s) that should be added to the conversation once the condition is met:

actions-add-members.png

  1. If you want the action to run only once per conversation, enable the option Execute specified task only once per conversation. Otherwise, the action is performed each time the conditions are met.

execute-specified-task-only-once-per-conversation.png


Click Apply to save the action.

Notes:

  • You can configure actions to send one-time notification (e.g. “We’ll get back to you later”) or set up multiple actions.

  • Up to 3 conditions can be set per Action.

  • If no Conditions are added, the Action is triggered after every message.

  • If a bot is configured in Send message Action, and an agent removes this bot from the conversation, the bot will be automatically added to the conversation and continue executing the action. 

  • In case a bot was configured in Actions, but was later deleted from the Chat Bots list on PBX, the bot will still be added to the conversation and continue executing the action (the "Send message" task).

  • When agents are added to the conversation via the "Add members" action, no system message is displayed. 

  1. To configure routing settings during out of working hours, proceed to the Out of Working Hours section and choose where the incoming conversation should be routed: to an agent, service or bot:

out-of-working-hours-settings.png

Set a Welcome message and quick replies if required:

out-of-working-hours-welcome-message.png

Add actions for out of working hours if required: 

actions-for-out-of-working-hours.png

  1. At the right, you can see the preview of your widget. Once you've filled out the necessary details, click Add:

add-widget.png

  1. The widget appears in the Widgets list:

saved-widgets.png

  1. To copy the widget link, open the widget -> navigate to the Installation instructions tab (1) and copy the link in the Share with customers field (2): 

Edit Kite website widget 

To edit website widget:

  1. Go to WMS -> PBX -> Integrations -> Cloud integrations

  2. Choose Kite:

  3. Click the pencil (Edit) icon next to the necessary widget: 

Embed widget on a website

Widget implementation on a website is performed by website webmaster, by pasting the code before closing HTML </head> tag on the web page the widget has to be added to. 

You can find installation instructions on the Installation instructions tab of the widget: