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. You can create your own new triggers to get more functionality.

Choose your live chat. Go to the “Bot Structure” tab, and choose a trigger.

Welcome Message

This flow is sent once a user starts a live chat.

Explain how your live chat can be useful to a website visitor, what information it can provide, and how quickly your live chat agent will be able to respond. You can also use your welcome flow to launch other trigger flows.

Standard Reply

The flow will launch in response to any user question that is outside your chat’s scenario, or by sending an image. Here, you can mention that your live chat agent will contact your website visitor during business hours and respond to them.

You can set up a flow restart interval limit between 1 minute and 24 hours — your live chat won’t be started a second time within the specified interval.

Unsubscribe from Bot

This one-message flow is launched when a user disables automated bot replies using the /stop and /unsubscribe commands.

Trigger Flow

You can add keyword triggers that your live chat will react to and launch your flow.

Click Create a new trigger. Type in your trigger using one or several words separated by commas. For example, you can use words like “order,” “tickets,” “price,” or “delivery.”

You can also set a throttle interval.

Once you create your trigger, click Add, and start setting up your flow.

Building Your Flow

It’s important to think about your live chat architecture beforehand to allow users to get answers to their questions or share their contact data easily.

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

All the elements available in the builder are optional, you can even stop building after the first message element.

Check out our blog for more chatbot tips, strategies, and inspiration.

Start

Select the first element that launches your flow ("Message," "Filter," "Randomizer," "Action," and "API Request").

For example, using the "Filter" and "API Request" elements, you can check your subscribers’ data and personalize your communication with them by launching your flow only for those who have or do not have the requested data or branching your flow to send different messages to different users. Using the "Randomizer" element, you can diversify your live chat's auto-replies or create an A/B test.

To make an element your start element, link it to “Start.”

To see which trigger starts your flow, click "Start."

The "Message" Element

Using the "Message" element, you can create a text message and add text, images, and files to it.

Text

Enter your message text. One text element cannot be longer than 512 characters, including spaces. You can also add variables to your text.

To add a variable, click {} in the upper right corner of your text element, and select a variable from the drop-down list. If a users’ contact info contains a value for this variable, they will receive your message with the value filled in.

You can also add different types of variables.

Custom contact variables

Variables are automatically set in your flow with the help of the "Action — set variable," "User input," and "API request" elements. You set and update your variables manually in the "Audience" section or chats.

Read also: How to Create a Variable in a Chatbot Audience.

System variables You can insert the text of your subscriber’s last message using the last_message variable. You can also add a subscriber ID using contact_id.
Global variables You can create your own variables in your live chat settings and use messages with predefined values that will be shared with all of your subscribers. By default, $bot_name, $bot_id, and $current_date are available.

Buttons

Add buttons to link your "Message" element to other elements, provide a link to an external source, or accept payments. This is one of the most important elements for user communication — buttons engage your subscribers and let them choose a scenario direction where your bot will take them.

To add a button, click + Add button. Select a button type: "Continue flow," "Link," or "Payment."

Name your button in the first field — enter up to 20 characters or emoji.

Your button text should be easily understandable — it’s important that users understand what will happen when they click your button and know which option they choose. Make sure that the next element in your flow corresponds to what the button says it will do to maintain the logic of your bot.

We recommend adding the “Back" and “Back to main menu" buttons after all the information you add, so users can choose another flow path. This prevents the logic of your bot from being broken with one message.

For a button with the "Link" type, you can also attach a link to a third-party source and continue the flow.

Quick Replies

You can also add another button type: “Quick Replies” (preset replies for chatbot users). Unlike “User input,” they do not save user data , but you can use them to expand your number of buttons and link each button to the next scenario branch.

If you turn on the “Wait for the subscriber’s response” toggle, the quick reply buttons not linked to user input will be disabled. You can use quick reply buttons only once as quick replies for user input or as keyboard reply buttons.

To add quick reply buttons, click Quick replies in the editing panel of the “Message” element, and enter your button name: emoji or text up to 20 characters. You can add up to 10 buttons.

Quick reply buttons are displayed to users below the input field. Users can hide the buttons and show them by clicking the corresponding icon on the right of the input field.

Once users send the next message, quick replies disappear. To quickly prompt a message with these buttons, we recommend creating a trigger and a flow using this trigger.

Images

Diversify your messages by using relevant visual content.

Click Select file to upload an image from your device, or drag and drop a file.

To upload an image using a link, select "URL" in the drop-down list, and specify your image link in the field.

You can also specify a dynamic path to the image. For example, using the "API request" element, you can send a product picture and use this variable in the following message, displaying order data to your client.

To do this, select a variable, or specify a JSON path in the field, and pass the image path in your variable value. This way, each client will receive an image based on their order.

File

You can add files of any format except executable files of up to 20MB. Attach tickets, maps, checklists, instructions, or other additional materials.

Click Choose File to upload a file from your device, or drag and drop a file.

To upload a file via a link, select “URL” from the drop-down menu, and specify your file link in the field.

You can also specify a dynamic path to your file. For example, using the "API request," element, you can send a file and use this variable in the following message, displaying order data to your client.

To do this, select a variable, or specify a JSON path in the field, and pass the image path in your variable value. This way, each client will receive a file based on their order.

Delay

Split your large text into small paragraphs of up to 4 lines and separate them with the "Delay" element, displaying the typing indicator.

This element cannot be the last one in your message, meaning that you need to add a text, image, or file after it. Specify your delay time in seconds — your typing indicator will be displayed during this time.

When setting your delay time, keep the size of your next message in mind.

User Input

You can gather information from users and save it to a variable for future use.

Only your website visitors can interact with your live chat. They do not become its regular subscribers and communicate with it directly on your website. We recommend requesting and collecting user data that can be used to contact your website visitors after they exit your live chat.

Turn on the “Wait for the subscriber's response” toggle. Select a validation type, message to be sent if the data is entered incorrectly, and variable to save the data to. You can set up the following validation types for this value: "String," "Number," "Date," "Date and time," "Email," "Phone," "Link," "Geolocation," "Regular expression", "Image or Document."

Enter the text that your visitors will see if the data they entered is incorrect.

Select or add a variable where your visitors’ data will be saved.

The received email addresses, phone numbers, and all other variables are saved to the “Audience” section of your live chat.

You can also set your response wait time. If a user has not replied within the selected time, your live chat will no longer validate the entered data to record the user’s response.

Move Elements

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

Continuing a Flow

You can link the next element after the “Message” element using “User Input” or connect it to another element without waiting for a user to respond. We recommend using it with the "Pause" element to check if a subscriber interacted with your flow and sent a message after a particular amount of time.

When planning a flow scenario, keep in mind that you cannot both continue your flow using the "Continue" connector and use quick replies.

Linking Your Elements

Drag a line from the blue dot of one element to another element to link them. To remove a link, click the line.

The disconnected elements will be highlighted in yellow to remind you that you need to link them to other elements.

Elements with empty fields will be highlighted in red to remind you that you need to fill in their fields if, for example, you added the ”User input” element but did not add a variable.

The "Action" Element

The “Action” element is visible only to you. Select the element from the left sidebar, and place it below the element you're tracking.

Then, select an action.

Open the chat Open a chat with a subscriber in the "Conversations" section.
Unsubscribe from the bot Stop automated messages.
Add or Remove tags Assign a tag to a subscriber or remove a tag assigned to a user.
Add variable Set a variable value to be assigned to a subscriber. You can also create a new variable.
Send webhook Send a POST request with user data to your URL
Create deal Create a CRM deal when a certain action is performed, for example, when a visitor shares their data.
Notify me Send a message to the “SendPulse Notifications” bot. To do this, select the "Notify me" option in the live chat settings.

The "Flow" Element

You can simplify your live chat structure and move your user to another flow.

To do this, add an element, choose the “Flow” element, and select a flow 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 "Filter" Element

Segment customers by various data, such as country-specific phone numbers, if your visitors provided such data earlier. You can also segment your live chat replies based on your company's working hours, for example, send one message from Monday to Friday and a different one on Saturday and Sunday.

Select the element from the left sidebar, and place it below the element that will start your script branching.

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

Read also: How to Use the "Filter" Element in the Chatbot Flow Builder.

Once you add your conditions, add more flow elements to each of the “Filter” element options if the condition is met (green dot) or not met (red dot).

The "Pause" Element

This is the period during which no automated messages are sent to subscribers. The pause can be set in seconds, minutes, or hours.

You can also use the "Pause" element to set a condition for the next element in the flow: send always or when the subscriber is inactive.

The "API Request" Element

Available with the Pro plan and above, as well as during the 7-day free trial

Send requests to a third party server to create objects or retrieve data. Get data points and use them in your live chat 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, and place it below the element from which you want to retrieve data. Select a request type, and enter the URL where you want to send the request to.

Once you test the request and receive a successful response, configure your mapping settings. If you need to save the response value to a variable, select the received request key and the variable where you want to save it. If you want to use the received value once without saving it to a variable, copy {{$ ['somekey'] ['nestedkey']}} , and use it in the next element.

Read more: How to Send and Receive Data from External Sources.

The "Random Choice" Element

Randomly send elements from your live chat scenario 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 live chat scenarios.

Drag the item "Random choice" element to the working area, and link it to the element that will start your script branching.

Learn more: How to Use the "Randomizer" Element.

Save and Launch Your Flow

Once you add all the elements and check the links between them, save your flow before you exit. To do this, click Save and exit.

Managing Your Flows

You can enable and disable flows at any time by choosing a flow on your live chat dashboard and turning its toggle on or off.

Disabled flows will have a gray toggle switch.

Analyzing Your Results

SendPulse allows you to track your overall live chat statistics in the "Statistics" tab.

You can see the number sent and read messages and flow redirections in total and for each message individually in the "Bot structure" tab.

Visitors are identified by their location — this info is recorded as a name.

    Rate this article about " How to Create an Automated Live Chat Flow for Your Website"

    User Rating: 4 / 5

    Popular in Our Blog

    Try creating a chatbot for Facebook Messenger for free