How you can set up Live Chat in HubSpot

In HubSpot, you can create a chatflow with live chat to connect a visitor on your website directly with your team members. The live chat will appear on your website pages where the visitor starts a real-time conversation with your team.

Before you start creating a live chat, connect a chat channel to the conversations inbox. In the chat channel, you can customize your team's availability and the appearance of the chat widget.

To create a live chat

How to create live chat in HubSpot
  • Go to Conversations > Chatflows in your HubSpot account.
  • Click Create chatflow in upper left.
  • Select Website.
  • Select a live chat:
    • If you want a that the visitor can immediately start a chat your team, select Live chat.
    • If you're using Service Hub Professional or Enterprise account and have at least three published knowledge base articles, to search the knowledge base directly from your live chat widget, select Knowledge base + live chat to add the option.
  • Click Next.
  • Click the dropdown Select an inbox to select an inbox if you have set up multiple inboxes.
  • You can also change the language of your chatflow, click the dropdown Select a language and select another language.
  • Click Create.

    Name the Chatflow from the top of the page.

1. Build.

To create a welcome message:

To create a welcome message for Live Chat in HubSpot
  • Click the toggle Enable knowledge base search to switch on to allow your website visitors to search for answers from the Knowledge Base articles before chatting with your live chat team.
  • To assign the incoming conversation specific team members, first switch on the toggle Automatically assign conversations, then click dropdown to select the users to assign the conversations to.
  • To set when the visitors should be requested to provide their email address, click the dropdown Ask visitors for their email address.
  • Enter the message in the Email capture message text box which you want to display when the chat widget requests the visitor for their email address.
  • You can see the preview of your live chat by clicking Preview from the top right.

  • Click Save at the bottom
  • To continue, click the Target tab

2. Target

Choose which pages the chat widget should appear on, and who it should appear for:

How to choose a page for Chat to appear on in HubSpot
  • To show the live chat widget when a visitor is on a specific website URL, in the Website URL section:
    • Click the first dropdown and select Website URL.
    • Click the second dropdown menu and select a targeting rule.
    • Enter the rule criteria in the text field.
  • To add another rule, click +Add rule.
 Click Add exclusion rule to exclude the live chat widget from specific pages.

If you have some information about the visitor, you can target your live chat based on that information. To set criteria dropdown When in the Visitor information and behavior section:

  • Click the first dropdown menu and select a filter.
  • You can use filters that specifically target both known contacts or unknown visitors.
  • Click the second dropdown menu and select your criteria.
  • Click Add rule to add another rule.
  • Click Add exclusion rule to exclude the pop-up forms on specific pages.
  • Click Add filter group to create another filter group with additional targeting rules.

3. Display

You can customize the live chat's display setting from the Display tab:

How to choose a page for Chat to appear on in HubSpot
  • Click the dropdown Chat heading to select the name to appear on the chat widget.
    • Custom branding: display a general team name and image. Add an image by clicking onthe + icon and enter the Name.
    • Specific users and teams: select the checkboxes next to the names to display when the chat start. 
    • Contact owner: click the dropdown New visitor fallback to select a fallback option for any new or unassigned visitors.
      • Custom Branding: Enter the name and + icon to add a pic
      • Specific users and teams: select the checkboxes next to the names to display when the chat start.

You can control the widget's behavior on desktop or mobile screens from the Chat display behavior section.

4. Options

You can customize your live chat's language settings from the Options tab:

How to customize live chats language settings
  • Language:

    • Click the dropdown Select a language to select a language then click Save.
  • Data privacy & consent:
    •  Click the toggle Consent to collect chat cookies to switch on to enable cookie consent text for the live chat widget.
    • You can select when the consent banner should appear. Select the radio button:
      • Show before visitors starts a chat or 
      • Show vsitior on exit intent.
  • Consent to process data:
    • Click the toggleConsent to process data to switch on to store and process your customer's personal information.
  • Consent to communicate: 
    • Click the toggle Consent to communicate to switch on to give the visitors options regarding subscription types.