Introduction

Proactive chat lets you engage website visitors before they even ask for assistance. Of course, you could sit back and wait for them to make the first move, but it’s better to be proactive rather than reactive.

Proactive chat includes an automated message that invites your site visitor to start a conversation after a specific time.

This feature helps a live chat agent take the initiative, show concern, and willingness to solve customers' issues as soon as possible.

For this purpose, it was developed on our ECS Admin App, a new section named Behaviours.


This section will help you create multiple behaviour configurations for each business process in your company. For instance, you can set different schedules for Sales, Technical support, and more.

How to Create a New Configuration

Behaviours

Click on the [Behaviours] tab in the ECS Admin App, and then click on

Basic Setup

The New Configuration wizard will guide you through the configuration process (see the below image).

  • Fill in the required information for each field, click “Next” to continue.

Working Hours

To create a workday schedule(s), add From and To times in the field (shown in the below image).

  • Fill in the desired times for each day, click "Next" to save working hours, and continue.

Holidays

To create holiday schedule(s), add From and To times in the field (see image below).

  • Fill in the desired times for each holiday, click "Create" to save the New Configuration.

As a result, you will see a new card with all your configurations summarized (see below image).

How to Edit, Duplicate, or Delete a Configuration

Once you see your newly created card you can modify the configuration.

  • Click on the options icon and choose the desired choice to modify the configuration card.
    • Edit
    • Duplicate
    • Delete

Code Snippet

Once the configuration parameters are done, you will need to generate these settings and add the code to your webpage.

  • Click on "Copy Code Snippet", you will then see a confirmation message indicating that the code was successfully copied to your clipboard.

Provide the copied snippet to someone on your dev team, or someone in charge of updating your web page, or web app.

  • Recommendations:
    • Paste the copied snippet as is onto your web page/app. NOTE: the snippet does not rely on any framework.
    • It is intentionally developed in vanilla JS so it can be included in ANY web page/app without any concern.
    • It has some CSS variables that can be customized to precisely match any app style.
    • All icons are already included as SVGs inside the code snippet, you are free to update any of them.
    • You can copy and paste the snippet as is at the end of your <body> tag. You only need to insert a new <script /> tag to paste the script content.
  • You're done.

Technical Specifications

  • This script handles everything in the initial configuration (when you copied the script).
  • All components, icons, and styles are embedded in the script so that your customer will not hit any external resources to make this proactive chat work.
  • Since this script does not trigger any network request until someone explicitly starts a chat session, this will not slow down anything on your web page/app due to network conditions.
  • The whole script will not impact your web page/app performance. It runs once, sets a timeout to pop up an offer to start a chat, and everything else runs only after a customer interaction happens.
  • Once you include this script on your web page/app the initial setup containing data such as the welcome message or working hours will get updated every time the customer starts interacting with Proactive Chat.
  • This script will run autonomously without hitting any Evolve IP server until the customer decides to start a conversation.
  • Once the customer decides to start a conversation the script will check and update the initial configuration.
  • Next time the same customer tries to start a chat it will use the updated configuration (if any).
  • No labels