1
Where to Find the WebChat Widget
Introduces the webchat widget course — how to customize the widget to match your branding and install it on your website.
Basic
Web Chat Channel: Customization, Installation & Conversion Tracking
Transform website chats into conversion engines! Master widget customization, flow triggering, user pre-filling, and GA4 tracking — all while matching your brand perfectly.
Module 1 — Widget Basics
2
Customizing the Main Elements
Explains how to customize the content section of a web chat widget — chat bubbles, headers, welcome messages, out-of-office replies, and chat forms.
3
Customizing the WebChat Widget
Covers language settings, notification sounds, emoji/attachment uploads, chat window behaviors, mobile continuation, and domain whitelisting.
Module 2 — Pre-Chat Form & Colors
4
How to Use Pre-Chat Form
Covers enabling the pre-chat form, adjusting form fields (text, email, phone, date, choices), setting placeholders, hints, required fields, and layout options.
5
Customizing Your Colors
Tutorial on customizing the appearance of a webchat widget — themes, fonts, colors, and the start chat button including rounded corners and circle shapes.
6
How to Install the Widget
Demonstrates how to install webchat widgets on websites using different methods — scripts to headers or specific pages, and customizing widget styles and placement.
Module 3 — Flows & Styles
7
How to Start Different Flows and add Payload to your Widget
Explains how to trigger different chatbot flows using webchat widget URLs with custom parameters and payloads. Covers creating multiple flows and passing custom data points.
8
Different Styles of Widget
Demonstrates various styles of embedding web chat widgets — inline embeds, pop-up modals, full-page integrations, and floating models.
9
How to Format Text Inside WebChat Channel
Explains how to format text using markdown-like syntax — bold, italic, bold-italic, and strikethrough using specific symbols.
Module 4 — Advanced Integration
10
Embed Web Chat into any Page & Trigger Different Flow
Covers domain listing, installing the embed script, matching embed IDs, customizing chat appearance, and triggering different chat flows on specific pages using URL parameters.
11
Secret Trick to Open Full Page Mode
Explains a simple trick to open a web chat in full page mode by adding 'style=full' to the URL for a better user experience.
12
Prefill User Data For Web Chat
Advanced feature — passing customer information and custom parameters directly into the chat widget dynamically updating user data using scripts.
13
Set up Custom User ID
Explains the custom user ID feature — pass user details from an external website into the chatbot for a personalized experience for logged-in vs guest users.
14
Google Tag Manager Integration
Covers tracking chat engagement events, creating triggers and tags in Google Tag Manager, and sending data to Google Analytics, Facebook, and Google Ads.
15
Web Chat Conversion Tracking to GA4
Explains how to track web chat conversions in Google Analytics 4 — sending conversion events, attributing them to the original traffic source, using measurement protocol.