SaaS Support Monitor | Supervisor Control Center

⚙️ Branding & System Settings Configure brand name, logos, favicon, and system auth

Change Brand Name

Change Favicon (URL or Upload)

Upload

Change Brand Logo (URL or Upload)

Upload

3rd Image Asset (URL or Upload)

Upload

Admin Authentication Credentials

Admin Username

Admin Password

💬 Department Auto Greetings

Set default welcome text and sender agent per department

Technical Support Enable Greeting

Sender Agent

Welcome Message

Sales & Demos Enable Greeting

Sender Agent

Welcome Message

Billing & Accounting Enable Greeting

Sender Agent

Welcome Message

🤖 AI Assistant Chatbot Enable AI Bot Mode

Configure display credentials and keyword-matching auto-replies for the AI Chatbot helper.

Bot Display Name

Bot Avatar Image URL

Bot Welcome Message

Custom Interactive Bot Options (Clickable Buttons)

Fallback response (default):

🎨 Widget Bubble Appearance Changes apply to the customer chat bubble

Live Preview

Bubble Background Color

to Gradient

Bubble Label Text

Custom Bubble Icon (Image URL or Upload)

or Upload Image

Leave empty to use the default chat bubble icon. Uploaded images are stored physically on the server.

Bubble Label Font

Bubble Label Font Size

Pre-Chat Welcome Title (Header Name)

Widget Header Title (Default Desk Name)

Pre-Chat Brand Logo (Image URL or Upload)

or Upload Logo

This logo will be displayed at the top of the Pre-Chat Form window.

🏠 Homepage Content Settings Manage logo, header menu navigation, badges, headlines & subtext

Brand Logo Text

Hide Logo Text

Navigation Links

Hide Entire Nav Menu

Hide

Subheader Pill / Badge

Hide Badge Pill

Headline & Subtext

Main Title / Headline (Supports HTML/span)

Hide Title Headline

Main Subtext / Description

Hide Subtext Description

Pricing Page Content

Pricing Header Settings

Header Badge

Hide Badge

Header Title

Hide Title

Header Subtext

Hide Subtext

Plan Card 1 (Starter) Hide Card

Plan Name

Price

Billing Period

Button Text

Short Description

Action Link (e.g., mailto:developer@domain.com or URL)

Features List (One per line)

Plan Card 2 (Pro) Hide Card

Plan Name

Price

Billing Period

Badge text

Short Description

Button Text

Action Link (e.g., mailto:developer@domain.com or URL)

Features List (One per line)

Plan Card 3 (Enterprise) Hide Card

Plan Name

Price

Billing Period

Button Text

Short Description

Action Link (e.g., mailto:developer@domain.com or URL)

Features List (One per line)

🔌 Widget Installation & Integration Add live chat to HTML sites or Next.js React apps

Kopyahin lamang ang code snippet sa ibaba at i-paste ito bago sumara ang </body> tag ng iyong target website o sa website ng kliyente mo para mailagay ang Live Chat.

HTML Integration Code (Auto-generated)

Step 1: Gumawa ng bagong component file sa iyong Next.js project: components/ChatWidget.tsx. Kopyahin at i-paste ang code sa ibaba.

ChatWidget.tsx Component Code (Auto-generated)

Step 2: I-import ang component sa root layout (app/layout.tsx para sa App Router) sa dulo ng body:

import ChatWidget from '@/components/ChatWidget';

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        {children}
        <ChatWidget />
      </body>
    </html>
  );
}

Overview Monitor

0

0

0

0.0

Agent Operational Load

Recent Customer Ratings

Conversation Inbox Log

Dashboard Settings Configuration

Admin Authentication Credentials

💬 Department Auto Greetings

Custom Interactive Bot Options (Clickable Buttons)

Brand Logo Text

Navigation Links

Subheader Pill / Badge

Headline & Subtext

Pricing Page Content

0

0

0

0.0

Agent Operational Load

Recent Customer Ratings

Conversation Inbox Log

Dashboard Settings Configuration

Admin Authentication Credentials

💬 Department Auto Greetings

Custom Interactive Bot Options (Clickable Buttons)

Brand Logo Text

Navigation Links

Subheader Pill / Badge

Headline & Subtext

Pricing Page Content

Chat Log

Add New Support Agent

Edit Agent Account Details