Add a Hubspot chat widget to your Flipsnack catalogs

Install a chat widget for your flipbook readers using the Hubspot chat flow option.

Table of contents

Overview

A chat widget is a valuable tool for engaging your audience in real-time conversations about your products and services. By using HubSpot’s built-in CRM solution, you can install a chat widget on both your Flipsnack profile and flipbooks.

Hubspot chat widget in Flipsnack

Requirements

Before starting, ensure you have:

  • The HubSpot tracking code installed on your Flipsnack profile using Google Tag Manager.

  • At least a free HubSpot account.

How to Add a HubSpot Chat Widget

How to add a chatflow in Hubspot

  1. Log in to your HubSpot account and navigate to Conversations > Chatflows.

  2. In the upper right, click Create Chatflow.

  3. Select Website.

  4. In the left sidebar, choose a live chat option:

    • Live Agent: Best for businesses that want real-time human engagement. Visitors chat with live agents who can provide personalized responses and support.
    • Customer Agent (+ AI): Uses AI-powered automation to scale support, freeing up live agents for more complex conversations.
    • Rules-Based Chatbot: Creates automated chat flows for specific tasks, such as booking meetings or directing visitors to sales.
  5. If you have multiple inboxes set up, click Select an inbox and choose the appropriate one.

  6. To change the chatflow language, click Select a language and choose a different language.

  7. Click Next.

Configuring Your Chatflow

Build chat widget in Hubspot

  1. Customize your chat widget settings:

    • Create a welcome message to greet visitors.

    • Set up email capture to collect visitor emails.

    • Assign specific users or teams to respond to chats.

  2. Set availability settings:

    • Define when your team is available for live chat.

    • Configure automated responses for out-of-office hours.

  3. Click Next.

Setting Up Targeting Parameters

Chat widget targeting parameters

  1. Navigate to the Targeting tab.

  2. Define the conditions for when the chat widget appears, such as:

    • Page URL: Show the chat widget only on specific pages.

    • Visitor Behavior: Trigger the chat widget based on time on page or scroll percentage.

    • User Characteristics: Show the widget based on visitor location or device type.

  3. Activate the chatflow toggle to enable the widget.

Once activated, your HubSpot chat widget will now be visible on your Flipsnack profile.

Chat widget on Flipsnack profile

Next Steps

Further Reading

For more information on setting up a live chat, refer to:

Explore more HubSpot and Flipsnack integrations:

Need expert support?

Our team is here to help. Connect with our team experts or message us via the in-app chat for a personalized demo.