Xenioo
  • Welcome!
  • Basic Concepts
    • Your Account
      • The Free plan
      • Upgrading to a paid plan
      • Canceling your subscription
      • Deleting your account
      • Additional Packages
      • Support
      • Payment & Invoicing
      • Messages Count
    • Designing your Chatbot
      • Introduction
      • Behaviors
      • Interactions
      • Actions and Operations
    • Chatbot Details
      • Chatbot Settings
        • General Chatbot Settings
        • Chatbot Conversation Settings
        • Chatbot Integration Settings
      • Teams
        • Team Permissions
        • Team Message Templates
        • Team Member Access
      • Backup & Restore
      • Clone and Reference Clone
    • Publishing
      • Live & Draft Chatbots
      • Publish Your Bot
      • Channels
        • Web
          • Web Variables
          • WordPress
          • Widget Customization
            • Initialization
            • Scripting
        • WhatsApp
          • WhatsApp Variables
          • First Message Processing
          • Configuring Providers
            • Infobip
            • ZOKO
            • MessengerPeople
            • Twilio
            • Chat-API
            • Maytapi
            • Wassenger
            • Waboxapp
        • RCS
          • RCS Variables
          • Configuring Providers
            • LINK Mobility
        • Google Business Messages
          • Google Business Messages Variables
        • SMS
          • SMS Variables
          • Configuring Providers
            • LINK Mobility
        • Facebook
          • Facebook Ads Integration
          • Feed Integration
          • Messenger Referral
          • Facebook Variables
          • Moving users from an existing bot to Xenioo
        • Telegram
          • Telegram Deep Linking
          • Telegram Variables
        • Slack
          • Configuring Slack
          • Slack Variables
        • Microsoft Teams
          • Microsoft Teams Variables
        • Discord
          • Discord Variables
        • Alexa
          • Troubleshooting
          • Alexa Variables
        • Google Assistant
          • Google Assistant Variables
        • Phone
          • Phone Variables
          • Configuring Providers
            • Voximplant
        • Custom
          • REST Reference Guide
          • API Variables
    • Users and Conversation Persistance
  • Artificial Intelligence
    • Intents
    • Expressions
    • Entities
      • Creating Manually
      • Entity Types
      • Synonims
    • Training & Testing your Model
      • Using the NLP Parse Logs
      • Importing Intents From File
    • NLP Master
  • Database
    • Xenioo Database
    • Collections
      • Import And Export Collections Data
    • Database API Interface
      • Url Filtering Syntax
      • Save To Collection
      • Delete From Collection
      • Query Collection
      • CSV Direct Data
  • Broadcasts
    • Broadcasts
      • Settings
        • On Demand
          • HubSpot
        • On Date And Time
        • On Time
        • On Trigger
        • On Interval
    • Campaigns
    • Distribution Lists
    • Audiences
    • Distribution Logs
  • Conversations
    • Conversations
    • Contacts
    • Chat Commands
    • Contact Details
    • Data Retention
  • Actions And Operations
    • Execution
      • Execution Diagram
    • Actions Availability
    • Variables and Tags
    • Dynamic Parsing And Content
    • Content
      • Text Action
      • Random Text Action
      • Quick Reply Action
      • Database Quick Reply Buttons Action
      • Quick Reply Array Action
      • Chat Delay Action
      • Phone Quick Reply Action
      • Email Quick Reply Action
      • Location Quick Reply Action
      • Display Location
      • Image Action
      • Video Action
      • Audio Action
      • File Action
      • Url Action
      • NLP Topics Summary Action
      • Highly Structured Message
      • Custom Class
    • Input
      • Voice Recognition Action
      • Global Detection
        • Text Parse Action
        • NLP Processing Action
        • Dialogflow Detection Action
        • IBM Watson Assistant Intent Detection Action
      • Generic Input Action
      • NLP Input Action
      • Number Input Action
      • Email Input Action
      • Phone Number Action
      • Media Attachment Action
      • Voice Input Action
      • Global Detection Action
      • Dialogflow
        • Dialogflow Input Action
        • Dialogflow Detection Action
      • IBM Watson Assistant
        • IBM Watson Assistant Input Action
        • IBM Watson Assistant Detection Action
    • Flow
      • Go To Action
      • Include Interaction Action
      • Random Split Action
      • Flow Control Action
      • Set Chat Operator State Action
      • Schedule Behaviour Action
      • Variable Switch Action
      • Tag Switch Action
      • Set Context Action
      • Conversation Bookmark Action
      • Create Conversation URL Action
      • Reset Conversation Action
      • Control Conversation Transfer Action
        • Forward Variable Value Action
    • Forms
      • Form Container
      • Fields
        • Text Box
        • Password
        • Text Area
        • Dropdown
        • Checkbox
        • Number
        • Date Picker
        • Time Picker
        • Calendar
        • File Upload
      • Layout
        • Image
        • Literal
        • Divider
        • Html Content
        • Custom CSS
    • Database
      • Load Single Record
      • Delete Records
      • Save Record
      • Save Raw Model
      • Query Collection Data
      • Move To Next Record
      • Set Field Filter Value
      • Order By Field
      • Set Field Value
    • Cards
      • Carousel Template Action
      • List Card Template Action
      • Buttons Card Template Action
      • Card Container Action
      • Interactive Message Action
      • One-Time Notification Request Action
      • Database Carousel Action
      • Dynamic Carousel Action
      • Card And Menu Buttons
        • Postback Button Action
        • URL Button Action
        • Call Phone Button
        • Share Button Action
        • Nested Button Action
        • Interactive Button
    • Profile
      • Set Variable Action
      • Delete Variable Action
      • Set Tag Action
      • Delete Tag Action
      • Set Campaign Subscription Action
    • Privacy
      • Forget User
      • Privacy Opt-In
      • Privacy Flag Condition
    • IoT
      • Control Device State
      • Device State Switch
    • Integration
      • Call API Service Action
      • Execute Cloud Script Action
        • Base Conversation object methods
        • Firebase Connection methods
        • Xenioo Database Collection Methods
      • Execute Client Script Action
      • Send SMS Message
      • Dynamic Content Action
      • Post To Facebook Action
      • Firebase Database Action
      • ActiveCampaign Action
      • Zapier Webhook Action
      • MailChimp Contact Action
      • Wordpress Search Action
      • RSS & Podcast Feed Action
      • SendGrid Mail Action
      • Send Mail Action
      • Send Custom Mail Action
  • Xenioo API
    • Choosing your API
    • Global Platform API
      • Authorization
      • Platform SSO
      • Bots
        • Publish
        • Clone
        • Reference Clone
        • Teams
          • List
          • Add Or Update
          • Delete
      • Conversations
        • Exist
        • Data
        • Share Url
      • AI
      • Statistics
        • Runtime Data
        • Report Files
        • Download Report File
      • Broadcasts
        • Broadcasts List
        • Broadcast State
  • Service State
    • Scheduled Maintenance
    • Platform Changelog
Powered by GitBook
On this page
  • Advanced Initialization
  • Changing initialization settings
  • Initializing with Variables and Tags
  • Starting from a specific behavior

Was this helpful?

  1. Basic Concepts
  2. Publishing
  3. Channels
  4. Web
  5. Widget Customization

Initialization

PreviousWidget CustomizationNextScripting

Last updated 3 years ago

Was this helpful?

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

<script src="https://static.xenioo.com/webchat/xenioowebchat.js"></script>
<script>
    xenioowebchat.Start("<chatbotid>");
</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 . As an example, you could change the chatbot widget appearance delay like this:

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

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

<script src="https://static.xenioo.com/webchat/xenioowebchat.js"></script>
<script>
    xenioowebchat.Start("<chatbotid>", {
            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://static.xenioo.com/webchat/xenioowebchat.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://static.xenioo.com/webchat/xenioowebchat.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.

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://static.xenioo.com/webchat/xenioowebchat.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.

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 settings.

Web Channel publishing
Web Publishing Dialog
Web Publishing Dialog