ServisBOT Messenger

ServisBOT Messenger is the default engagement adapter for endpoints. When creating an endpoint, unless the engagement adapter is set to something else, the bot will be available through our messenger.

Whitelisting Domains

You can restrict where your messenger can be displayed by providing a set of domains. When developing on a site locally, it might be helpful to add http://localhost/ or http://localhost:3000 depending on your local settings.

Styling Messenger

Many aspects of our messenger can be changed without any code. Things like the colors for the bot roundel, messenger, and timeline elements and text can be changed. Default bot roundel: BotRondel

  • Your messenger will inherit the default messenger style from our platform, unless you have something set up in your organization configuration with is available in the organization tab.
  • Your individual endpoints will inherit your organization style setting unless it has explicit styling configured.

The icon in the roundel can be customized by purchasing an add-on. Reach out to your customer success representative to get started.

Basic Messenger Styling

  • Customize a messenger to match your brand, navigate to the “Endpoints” section of this portal.
  • Select the default endpoint or endpoint for the bot you want to style.
    • You can alternatively get to an endpoint page by navigating to your bot’s resource tab and clicking on the settings link of the endpoint’s card.
  • You will then be able to give your messenger a title, subtitle, logo and background image.
    • the Logo’s max height is 34px tall. The logo will stretch to fill a maximum of 140px but it is recommended you keep the logo less than 80px in order to not conflict with other styling. Supported files include JPG, PNG and SVG.
    • The recommended size for the messenger background is 350px wide by 544px tall. Supported files include PNG and JPG
  • By scrolling further down, you will see a preview of messenger and color configurations to the left. You can change the colors of different elements of messenger and see what they look like before saving your changes.
  • To save your changes and apply this design to the selected bots messenger, select the “Save” button found in the bottom right-hand corner.

Internationalization

You can configure a bot’s endpoint to have a localized title, subTitle and a networkMessage. Before configuring the endpoint through portal, you need to pass in context parameter of Messenger Configuration with the lang of your choice (ex : es for Spanish fr for French).

//  ...other messenger configuration options
context : {
  lang : 'es' //to set Spanish
}

After setting the parameter, you can set options for that lang using Portal. In the endpoints section of Portal, opening a specific endpoint should have a section for Internationalization where custom localization could be set. In the JSON Editor provided, the default language is set to en with a localized title. You can edit this JSON to match the lang set in your messengers context. To have a localized Spanish title, subTitle and networkMessage the configuration would be:

[
    {
      "es": {
        "title": "Hola!",
        "subTitle": "Cómo estás",
        "networkMessage": "Mala conexión de red"
      }
    }
  ]

Note : Only title, subTitle and networkMessage properties are supported as of now. Passing an empty value or "" to the networkMessage will not display a subscription message while the bot loads.

Save the endpoint and you should see the bot reflect the new configuration.

Advanced Styling

Custom Styling

Further customization can be done to the messenger using custom CSS. You can do this by initiating messenger with customStyling. Read More

Custom Icons in the Roundel

When custom roundels are enabled for your organization, the endpoints and organization config will have additional fields that can have a custom logo uploaded. SVG format with a square aspect ratio and solid color is recommended.

Message Redaction

See here for details on how the ServisBOT V2 Messenger redacts sensitive data from messages: