conversations

Create chatflows

Last updated: April 25, 2019

Create chatflows to use on your website to easily engage with your website visitors. You can create two different types of chatflows:

  • Live chat: create a chat prompt with no associated bot to send visitors directly to your live team.
  • Bot: create an automated chat bot from one of three templates.

Please note: only users with Admin access can create and edit chatflows.

First, choose your chatflow type:

  • In your HubSpot account, navigate to Conversations > Chatflows.
  • In the top right, click Create chatflow.
  • In the left sidebar, select a chatflow type.
    • If you want to create a chat prompt that will send visitors directly to your live team, select Welcome visitors.
    • If you want to create an automated bot, select one of three bot templates: Qualify leads, Book meetings, or Support bot.

Please note: only Service Hub users with Admin access can create support bots.

  • In the upper right, click the pencil icon edit and select a language from the dropdown menu.
  • Click Next.
  • In the dialog box, click the dropdown menu and select a shared inbox.

In the chatflow builder, use the tabs in the left sidebar to configure your chatflow settings. Depending on the type of chatflow created, the settings on the Build tab and the Options tab will differ.


Create a welcome message (Build)

Live chat

Set up a welcome message so your website visitors can start chatting with your team right away.

  • On the Build tab, customize your message content:
    1. Chat heading: choose who the message should appear to be sent from.
      • Specific users and teams: select the checkbox(es) next to the name(s) to display. If you choose to send from a specific user, when more than three users are selected, the three users will be displayed randomly. Learn how your chatflow language impacts your display name.
      • Custom name and avatar: display a generic team name and image.
      • Contact owner: click the New visitor fallback dropdown menu and select a fallback option for any new or unassigned visitors who start a chat.
    2. Welcome Message: enter text for a welcome message. Learn more about changing the welcome message language.
    3. Automatically send incoming conversations to: set up rules to assign incoming conversations to someone on your team. Click the dropdown menu and select who you want your incoming messages routed to. You can assign these conversations to specific user(s) or team(s), or leave them unassigned for your team to triage from the conversations inbox.
    4. Ask visitors for their email address: specify when visitors will be asked to provide their email address.
    5. Email capture message: compose a message to display when asking visitors for an email address.chatflows-welcome-message
  • In the Display option section, customize the chat widget's behavior on desktops or small screen sizes:
    • Desktop: clear the Pop open the welcome message as a prompt checkbox if you do not want the welcome message to display by default.
    • Mobile: clear the Pop open the welcome message as a prompt checkbox if you do not want the welcome message to display by default on smalls screens. Clear the Show chat icon on small screen sizes checkbox if you don't want the chat icon to to display on small screens.
  • Click Preview in the top-right corner to see a preview of your live chat.

  • Click Save, then click the Who tab to move on to the next step.

Bot

Select which automated chat bot you want to create, then customize your bot actions and routing logic to determine the flow of the conversation. Each bot is set up with a default template, which you can further customize.

  • Click the Welcome message step. In the Welcome message panel that slides in on the right, edit your welcome message text and settings:
    • Enter text for a welcome message.
    • On the Desktop tab, clear the Pop open the welcome message as a prompt checkbox if you do not want the welcome message to display by default.
    • On the Mobile tab, clear the Pop open the welcome message as a prompt checkbox if you do not want the welcome message to display by default on smalls screens. Clear the Show chat icon on small screen sizes checkbox if you don't want the chat icon to to display on small screens.
    • Click Save. chatflows-chatbot-welcome-message
  • Click another bot message or action. In the panel that slides in on the right, modify the action on the Settings tab:
    • Nickname: enter a nickname for this bot message.
    • Message: enter the content for your first bot message. You can use personalization to pull in details from the contact record of a known visitor.
    • + Add message bubble: if you want multiple message bubbles to pop up as part of this bot message, you can add another bubble here.
    • Attach a file to this action: click the Choose a file dropdown menu, and either upload a new file or select an existing file to send to visitors.
    • Collect user input: use this checkbox to indicate that the bot should wait for a response before moving onto the next bot message. The first message in any bot sequence will have this option selected by default.
    • Save to HubSpot property: click the dropdown menu and select a specific contact property. The visitor's response will become the property's value on their contact record.
    • Skip this action if property already exists: use this checkbox to skip this action if the visitor's contact record already has this property filled out.
    • Quick replies: add answers that your visitor can click to respond to your message. To add quick replies, start typing your copy and hit Enter to save each one.
    • Disable free text input: use this option if you want to limit visitors to selecting among your pre-set options in Quick replies.bot-message-settings

 

  • Once you're done editing the action's settings, click the If/then branches tab to set up the flow of your conversation.
    • If you are a paid user, add conditional logic to your bot message by clicking Add if/then branch. Customize the conditions that must be met in order to direct the prospect to an appropriate response.
    • Click the Otherwise, go to dropdown menu and select the message that visitors will see if they do not meet any of the conditions set.

Please note: Sales Hub Starter, Service Hub Starter, Marketing Hub Starter, and free users cannot add custom conditions to their bot's conversation flow.

  • Click Save.

add-bot-action

  • In the top right, click Preview to see what your bot will look like on your website.
  • When you're done editing your bot's actions, click the Who tab to move to the next step.

Select a target audience (Who)

Decide who will see the chatflow on your website pages.

  • Select one of the following audiences:
    • Everyone: anyone who visits your site will see your chatflow.
    • Anonymous visitors: only untracked visitors who visits your site will see your chatflow.
    • Tracked contacts: only tracked visitors who exist in your HubSpot contact database will see your chatflow.
    • Segmented lists: only tracked visitors who meet your smart list criteria will see your chatflow. If you select this option, an additional dropdown menu will appear, and you can select your smart list from here.
    • If you want to hide your message from contacts who meet specific list criteria, click the Hide message from dropdown menu.
  • Click Save.

    Please note: if you select Tracked contacts or Segmented lists as your target audience, visitors who meet this criteria must have a tracking cookie associated with their contact record in order for them to see your chatflow.

Decide when the chatflow should appear on a page (When)

On the When screen, specify exactly when your chatflow should appear on your website using specific website URLs or query parameters.

  • If you target your chatflow based on Website URL:
    • Use the dropdown menu to select a targeting option for your website URL. Your options are: is all pages, is, isn't, contains, doesn't contain, starts with, or doesn't start with.
    • Enter the specific URL.
    • Use the wildcard option by adding * anywhere in the URL to capture all URLs that begin with the target URL. Multiple wildcards can be used within the same URL.
  • If you want to target your chatflow based on Query Param:
    • Click the first dropdown menu and select Query Param.
    • Enter the parameter name.
    • Use the dropdown menu to select a targeting option for your query parameters. Your options are: is all pages, is, isn't, contains, doesn't contain, starts with, or doesn't start with.
    • Enter the parameter value. chatflows-when-tab-url-targeting

Please note: the option is all pages only applies all pages created in HubSpot and does not include external pages with the HubSpot tracking code. Use other options, such as contains, to specify external pages where you want the chatflow to appear.

  • Click OR to add more rules.
  • To delete an existing targeting rule, click the trash icon delete.
  • Click Save.

Options

Live chat

Customize your live chat's language settings. If you've enabled General Data Protection Regulation (GDPR) in your account, you can also customize your live chat to include a step to ask your website visitors for their consent to communicate.

  • To capture a visitor's consent to process their data, click to toggle the Consent to process data switch on.
    • Click the Consent type dropdown menu and select one of the following:
      • Require explicit consent: with this option enabled, visitors will need to click I agree before they can send a message.
      • Legitimate interest: the visitor's consent is implied when they start to chat with you. The consent to process data text will still display, by they do not need to click I agree to start the chat. chat-widget-legitimate-interest
    • In the Process consent text field, explain why you need to store and process your customer's personal information.chatflows-live-chat-consent-to-process-data
  • To opt a visitor into a subscription type when they start to chat with you, click to toggle the Consent to communicate switch on.
    • Click the Subscription type dropdown menu and select which subscription type you are opting your visitors into.
    • Use the Checkbox label text field to inform customers what type of communication they're consenting to.chatflows-live-chat-consent-to-communicate
  • Click Save.

Please note: while these features live in HubSpot, your legal team is the best resource to give you compliance advice for your specific situation.

Bot

Customize your bot's display options.

  1. Chat heading: enter the name you want your bot to use to introduce itself. Hover over your bot's avatar and click Change photo to edit the photo.
  2. Error response: enter a response that will be delivered to users when a request can't be completed.
  3. Session timeout: the amount of time after inactivity before the chat session is reset to the beginning. The chat session will not reset if a visitor completed every bot action in a past session.
  4. Typing delay between messages: the time delay between each message that is sent to end-users.
  5. Language: the language your bot will be displayed in. chatflows-bot-options

If you've enabled GDPR in your account, learn how to customize your data privacy and consent options for your bot.

When you are done editing your live chat or bot, in the upper right, click to toggle the switch on to add your chatflow to your website pages. Once your chatflow is live, learn how to respond to incoming messages in your conversations inbox. enable-chatflow