Initialization

The standard initialization script for your web chatbot can be copied directly from the "How To Embed" tab inside the Web Channel publishing dialog. The script is already configured for your chatbot and will look like this one below:

<script [...] src="https://res.xenioo.com/plugin/xenioo.js"></script>
<script>
    xenioowebchat.Start("<API Token>");
</script>

This is the barebone initialization process: all the configuration will be read from your publish settings and nothing else is needed.

Advanced Initialization

The following sections will show how you can go much further with Xenioo initialization to significantly manipulate how the chatbot is initialized and settings are used.

Changing initialization settings

The initialization call can be modified to supply one or more initialization parameter that will override the settings you've specified in the Web Publishing Dialog. As an example, you could change the chatbot widget appearance delay like this:

<script [...] src="https://res.xenioo.com/plugin/xenioo.js"></script>
<script>
    xenioowebchat.Start("39b71741-1a09-45eb-86e4-f0c90b547d9d", {
            appeardelay:5
        }
    );
</script>

The above script will make the chat widget appear after 5 seconds. This parameter will automatically override the delay parameter you've specified in the Web Publishing Dialog settings.

You can of course add multiple settings like in the script below:

<script [...] src="https://res.xenioo.com/plugin/xenioo.js"></script>
<script>
    xenioowebchat.Start("<API Token>", {
            appeardelay:5,
            subtitle: 'Hello from Xenioo!!'
        }
    );
</script>

Use the table below as a general reference for all the initialization parameters you can override:

Parameter	Type	Effect
name	string	The title of the chat area
subtitle	string	The subtitle of the chat area
style	string	The full url of your custom chat style sheet
appeardelay	number	The amount of seconds the widget will wait before appearing on the page.
avatarinline	boolean	If enabled will display your chatbot avatar beside each message bubble
nocounter	boolean	Set to true if the small messages counter displayed on the widget is hidden, otherwise false.
enablesounds	boolean	Choose to enable or disable the messages sounds of the widget
startopen	boolean	If true, the widget will automatically open as you enter the page
backcolor	string	The background color of the chat area
forecolor	string	The foreground color of the chat area
autoopenchatdelay	number	The number of seconds after which the chat area will automatically open
autoopenchatmobiledisabled	boolean	Enables or disables the automatica opening of the chat on mobile devices
waitforwidgetclick	boolean	If enabled, the widget will not retrieve any message from the server unless the user clicks on the widget
hidetimepart	boolean	If true, the time of each message from the chatbot will be hidden
displayuseravatar	boolean	Set to true if you want to display the user avatar beside each user message
showbubble	boolean	If true, displays the message callout bubble near the chat widget.
enabletextreader	boolean	If true, displays a speaker button on the top right corner of the chat widget, enabling text-to-speech
enablevoicerecording	boolean	if true, displays a small microphone near the user send button, enabling speech-to-text
readerperson	string	The list of preferred voices that Xenioo will try to use
readerlanguage	string	The code of the language you would like to set for the text-to-speech and speech-to-text engines. The value must be set in the code_CODE format (e.g. it_IT, en_US etc).
speakerenabled	boolean	If true, the bot will start using text-to-speech right away, without waiting for the user to turn it on.
cookiedomain	string	Set the cookie domain name for the Xenioo chatbot cookie. The Xenioo chatbot cookie contains the current user-id for chat tracking. Use this setting to set an higher level domain for the cookie.

Initializing with Variables and Tags

Different pages on your website may need different variables or tags to be supplied to your chatbot. As an example, you could have your chatbot receive specific campaign parameters so that it can track users coming from specific ad. To do so, you supply variables or tags directly inside the initialization script. In the following example, we're sending the variable test:

<script [...] src="https://res.xenioo.com/plugin/xenioo.js"></script>
<script>
    xenioowebchat.Start("<chatbotid>", {
          variables:[
            { Name:"test", Value:"this is the value" }
          ]
        }
    );
</script>

In a very similar way, you can supply one or more tags:

<script [...] src="https://res.xenioo.com/plugin/xenioo.js"></script>
<script>
    xenioowebchat.Start("<chatbotid>", {
          tags:[
            "VIP_USER",
            "FROM_GOOGLE_AD"
          ]
        }
    );
</script>

Both variables and tags will be made available to your chatbot from the very start and can be used immediately in your flow.

Using variables or tags you can deeply customize the data used by your bot at startup. In the following example, we retrieve the current client IP and we supply the value to the current conversation as it starts:

<script [...] src="https://res.xenioo.com/plugin/xenioo.js"></script>
<script>
      
      fetch('https://api.ipify.org?format=json')
        .then(response => response.json())
        .then(data => {
              
              //now that we got the ip address, we forward it
              //to the conversation
              xenioowebchat.Start("<chatbotid>", {
                        variables:[
                              { Name:"ip_address", Value: data.ip }
                        ]
                      }
                  );
        })
        .catch(error => console.error('Error fetching IP address:', error));

    
</script>

Starting from a specific behavior

If you want your chatbot to start from a specific behavior you can set the corresponding API token directly in the initialization script:

<script [...] src="https://res.xenioo.com/plugin/xenioo.js"></script>
<script>
    xenioowebchat.Start("<chatbotid>", {
          behaviour: "<YOUR BEHAVIOUR API TOKEN>"
        }
    );
</script>

This setting will override the default start behavior and change the default flow. This setting is particularly useful if you have multiple pages on your website and want your chatbot to start addressing the user differently depending on the location.