website-assistant/AI Customer Service

7.7 AI Customer Service

AI Customer Service is one of the core features of the Pop Website Assistant. It allows you to embed an intelligent, customizable, knowledge‑base‑powered AI chat assistant directly into your website.

With just a single JavaScript snippet, visitors can open the chat window at any time and ask questions.
AI Customer Service supports:

  • ✓ Automatic greeting messages
  • ✓ Multi‑turn AI conversation
  • ✓ FAQ quick‑reply cards
  • ✓ Knowledge‑base retrieval
  • ✓ Fallback strategies (fixed reply / AI auto reply)
  • ✓ Multi‑language & multi‑theme
  • ✓ Mobile‑friendly UI
  • ✓ Multiple model options (GPT, DeepSeek, local models, etc.)
  • ✓ Optional image/screenshot input

1. How AI Customer Service Works

Visitor enters the website → The assistant button appears

Visitor clicks the button or a trigger condition is met

Chat window opens with greeting + FAQ

Visitor sends a message

System processes the message in order:

  1. Knowledge‑base retrieval (KB First)
  2. FAQ matching
  3. Fallback (fixed reply / AI response)
  4. Log visitor behavior & conversation history

No human agent is required.


2. Button Display Options

You can configure the assistant button inside Site → Customer Service Settings.

1) Button Position

  • Bottom‑right (default)
  • Bottom‑left
  • Right‑center
  • Custom margins (top / bottom / left / right)

2) Button Style

  • Circular button
  • Vertical text button (e.g., “AI Assistant” in vertical layout)
  • Expanded button (icon + label)

All colors, shadows, and backgrounds are customizable.

3) APNG Animated Icons

Supports animated PNG icons to draw attention.


3. Greeting Messages

You can configure multiple greeting strategies:

  • Fixed greeting message
  • Time‑based greetings
  • Different greetings for first‑time visitors / returning visitors
  • Auto‑popup after scrolling certain distance
  • Auto‑popup after X seconds

Example:

Welcome to our website! I’m your AI assistant—feel free to ask anything!

4. FAQ Integration

FAQs appear as quick‑click cards at the top of the chat window:

  • One‑click to send
  • Supports grouping & tagging
  • Supports sorting & enabling/disabling

Common uses:

  • Pricing
  • Download links
  • Login/register issues
  • Quick navigation
  • Tutorials & guides

FAQs are deeply integrated with AI Customer Service—clicking one sends it directly into the chat.


5. Knowledge Base (KB) Integration

AI Customer Service integrates tightly with Pop’s Knowledge Base.

Default KB Workflow

1. KB retrieval (BM25 / KNN / Hybrid)
2. If hit → answer using KB content + cited snippets
3. If no hit → apply fallback strategy

Supported content types:

  • PDF
  • Word / Markdown / HTML
  • Online documents
  • Website URL crawling
  • Manual text
  • Custom paragraph segmentation

Visitors will see citation marks such as “Based on the document: xxx”.


6. Fallback Strategies

When KB fails to find an answer, choose one of the following:

1) Fixed Reply

Example:

No related answer found. Please leave your contact information and we’ll get back to you soon.

Best for strict industries where AI cannot improvise.


2) AI Automatic Answer

Let the model respond based on context.

Advantages:

  • More natural
  • Better user experience
  • Less dependent on KB

Disadvantages:

  • Must ensure safe output (enable Safe Mode)

3) Combined Strategy

You may combine methods:

  • Show fixed reply first
  • Let the user click “Ask AI anyway”
  • Or switch automatically

7. Multi‑Model Support

AI Customer Service allows choosing different models:

  • OpenAI (GPT‑4.1 / GPT‑4o / GPT‑3.5)
  • DeepSeek (V3 / R1 / Chat)
  • Ollama local models
  • Any MCP model
  • Self‑hosted API proxy

You can configure models independently for the customer service module.


8. Chat Interface Overview

The chat interface includes:

1) Header Bar

  • Custom title
  • Close button
  • KB icon (optional)

2) Message Area

  • Multi‑turn conversation
  • KB hit indicators
  • Image previews
  • Typing animation

3) FAQ Section

  • Card layout
  • Grouped or tagged
  • Can be hidden

4) Input Box

  • Supports long messages
  • Optional image upload
  • Quick actions (e.g., Clear Conversation)

9. Mobile Adaptation

Pop’s customer service widget supports:

  • Auto full‑screen
  • Responsive layout
  • Vertical gestures
  • Orientation detection

Mobile experience feels similar to a standalone app.


10. Summary

AI Customer Service enables your website to:

  • Help visitors find answers quickly
  • Reduce pressure on human agents
  • Improve professionalism
  • Increase retention & conversions
  • Combine KB + FAQ for high‑quality responses