How to create an automated Live Chat flow for your website

An automated live chat flow allows you to help customers choose a product on your website and answer popular questions. Visitors can easily find what they need by contacting you via live chat.

Live chats also allow you to request additional customer data to continue your interaction using other communication channels. For example, you can ask a website visitor for their phone number or provide a link to your social media chatbot.

In this article, we'll talk about how to create an automated live chat flow.

Choosing a flow trigger

By default, there are Welcome message, Standard reply, and Unsubscribe from bot flows. And you can create your own new triggers to get more functionality.

Choose your bot. Go to the Bot Structure tab and choose a trigger.

Building your flow

It’s important to think about the architecture and logic structure of your bot carefully. A well-designed bot will let users easily get a reply to their questions or place an order successfully by providing the necessary information.

Formulate the bot’s tasks, divide its functions into sections, think of how you will connect the elements, and start creating your bot’s flow using our drag-and-drop builder.

To start setting up a flow, select a trigger, and click Edit flow. If you want to use your own trigger, click Create a flow.

Learn more about chatbot types and development strategies on our blog and YouTube channel. You can also select a ready-made flow template, copy a flow from another bot, or generate a flow using OpenAI.

Let's talk about chatbot builder elements. All elements are optional, so you can stop even at the first message without adding any more elements.

Start

You can choose the first element that launches your flow: Message, Filter, Randomizer, and API Request.

For example, using the Filter and API Request elements, you can check the subscriber's data and personalize your communication by starting your flow only for those users who have or do not have the requested data or branch your flow and send different messages. Using the Random choice element, you can diversify your chatbot's auto-replies or create an A/B test.

To make an element a start element, connect the desired element to the Start.

To see which trigger starts your flow, click on the Start.

The Message element

Use the Message element to create a message of any type and add various blocks to it: text, mediafiles, buttons, user data request, and so on.

For example, you can thank a user for their order, confirm the order, and clarify order details, including your acquired variable data.

Text

Use the Text element to add text.

In the text field, enter up to 2,000 characters of your message text. You can add variables and emoji to personalize your message.

Buttons

Use the Button element to engage subscribers, set your chatbot scenario direction, add a link, and accept payments.

To add a button, click + Add Button. Select the type of button: Continue flow, URL or Payment. 

You can add up to 13 buttons and for the Continue flow type and choose the layout that suits you best — from 1 to 4 in a row.

Images

Use the Image element to diversify your messages by using visual content that relates to your text.

To add a picture, click Add and select the Image element. Select how to add your image (as a file or link). You can also specify a dynamic path to the image link.

File

Use the File element to add files of any format, except executable files, up to 20 MB in size. Upload tickets, cards, checklists, instructions, or other files.

Click Add, and select the File element. Select how to add your file (as a file or link).

Delay

Use the Delay element to break long messages into smaller passages of up to 4 lines each.

Click Add, select the Deay element, and enter a value in seconds — from 1 to 5.

Quick replies

The Quick replies element appears as a keyboard menu and disappears when a user clicks it. You can use this element to branch your chatbot flow.

To add quick replies, click Quick replies in the editing panel of the Message element, and enter up to 20 characters of text and emoji as your button name. You can also add a variable to substitute dynamic values.

Waiting for the subscriber's response

Use the Waiting for the subscriber's response element to collect and save subscriber replies to variables.

Turn on the Waiting for the subscriber's response toggle. Select a validation type, type in a message users will receive if they enter invalid data, and select the variable to which you want to save the data.

You can also add quick replies so that users select from the options you offer instead of entering their own values.

Moving elements

By default, each element you add is placed at the end of the message element you are working on. Hover on the element that you want to move up or down and click on the corresponding button.

Continuing the flow

You can connect the next element after the Message element using the button or the Waiting for the subscriber's response option. You can also continue your flow without waiting for the user's response. We recommend using it with the Pause element to check if the subscriber interacted with the flow and send a message after a particular time.

Connecting elements

Drag a line from the blue drop of one element to another element to connect them.

Click on the line twice and you will see a button to remove a connection.

The disconnected elements will be highlighted in yellow, remember that you need to link it to another element.

Elements with empty fields will be highlighted in red, reminding that you need to fill in fields. For example - if you added a button, but did not enter text for it or used a link element, but did not enter a URL. You cannot save your flow until you fill in these fields.

You can link an unlimited number of elements to elements that wait for user response and link up to 100 elements to the Continue button.

The Flow element

Use the Flow element to simplify your bot’s structure and move your user to another flow.

To do this, add an element, then choose the Flow element and select the flow you want to link from the drop-down list.

The Flow element will be the last element in this branch of your existing flow. You cannot link it to another element to continue the original flow.

The Action element

Use the Action element to apply certain actions to a contact or its data. Select the element in the panel on the left and drag it after the block you're tracking. Then select what action you want to create.

The Filter element

Use the Filter element to segment customers based on their personal data and previous messages received.

Select the Filter element in the left sidebar, and drag it after the element that will start your script branching.

Then select the condition itself. Combine conditions by adding the operators any or all, or add independent additional conditions.

After adding conditions, add the additional flow elements to each of the Filter element options if the condition is met (green dot) or not met (red dot).

The API Request element

Use the API Request element to send requests to a third party server to create objects or retrieve data. Get data and use it in your chatbot messages.

You can save the received data to a variable or add it to a message as JSONPath.

Drag the API Request element to the workspace, connect it to the element, after which you want to retrieve data. Select the type of request and enter the URL to send the request to.

After testing the request and receiving a successful response, configure the mapping settings.

The Pause element

Use the Pause element to set up the period during which no automatic messages are sent to the subscriber. The pause can be set in minutes, hours, or days.

For example, you can use this option to indicate business hours or promotion hours.

Select the Pause element on the left, and edit it in the opened panel.

The Random element

Use the Random element to send elements from your chatbot script at random for A/B testing, creating quizzes, and more. You can customize the size of the recipient group for each option, send random information, and test different chatbot scenarios.

Drag the item Random element to the working area, connect it to the element you start branching the script from.

The Comment element

Use the Comment element to add comments about your flow performance for yourself or your team. Only you and other team members can see this element.

Drag the Comment element from the sidebar, and enter your comment text in the panel on the right. You can add up to 512 characters of text, links, and emoji.

Save and launch your flow

Once you’ve added and linked all the elements, save your flow before exiting. Click Save and send it to yourself to test your flow. Then, click Save and exit.

Make sure to add at least one Message or Action element.

You can view the total number of sent and read messages and clickthroughs in your flow and its messages in the Structure bot tab.

You can also track button clickthrough statistics in flow messages. Click the number on a button to see who clicked it.

Last Updated: 18.04.2024