> For the complete documentation index, see [llms.txt](https://library.zoom.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://library.zoom.com/technical-library/zh/shang-ye-ban-fu-wu/zoom-contact-center/expert-insights/customize-user-chat-support-experience.md).

# 自定义用户聊天支持体验

### 产品

* Zoom 呼叫中心
* Zoom Virtual Agent

### 前提条件

[将 Campaign SDK 嵌入到您的网站或移动应用中](https://developers.zoom.us/docs/contact-center/web/chat/#embed-the-chat-client-with-a-campaign-id)

### 概览

您的聊天窗口通常是客户与贵公司进行的第一次真实互动——无论他们是在与虚拟客服还是人工客服聊天。通过 Zoom 呼叫中心和 Zoom Virtual Agent，您可以完全控制该体验在网站上的外观和行为。

本指南将带您了解所有可用工具，帮助您设计与品牌一致、提升易用性并保持客户参与度的聊天体验。

### 制定计划

您的聊天 UI 应当像是您网站或应用的自然延伸。在规划聊天 UI 设计时，请考虑以下几点：

* **颜色：** 您公司的主色和强调色是什么？请将这些颜色用于聊天体验的不同元素，例如聊天气泡、图标、按钮和背景颜色。您将使用十六进制代码选择颜色（例如 #FFFFFF），因此最好手边备有品牌色值。
* **字体：** 保持与您站点的排版一致。您可以从几种常见字体中选择，也可以上传自己的 TTF 文件以添加自定义字体。
* **标志：** 考虑在聊天体验中添加您的标志或公司图片。您可以上传大小不超过 10MB 的 JPG/JPEG、PNG、SVG 或 GIF 文件。根据您选择的聊天设计，系统会推荐图片尺寸——下面会详细说明。
* **头像：** 头像是机器人或客服的图像表示。对于机器人或系统消息，请使用您的标志或代表您品牌的角色/头像。类似于网页浏览器中的 favicon，这些图标虽然很小，但如果与公司品牌契合良好，就会为体验带来不同。头像尺寸为 40x40 像素，您可以上传大小不超过 2MB 的 JPG/JPEG、PNG、SVG 或 GIF 文件。

### 组成部分

[Zoom 的 Campaign Builder](https://zoom.us/cci/index/admin#/admin-campaign-management) 用于自定义您的聊天设计以及其在网站或应用上的可用性。

在 Campaigns 中，您将设置：

* **聊天互动窗口：** 供用户与您的机器人或客服聊天。您可以选择所有气泡、按钮、图标以及页眉的设计。聊天窗口会极大影响您的数字支持体验的整体外观和感受。
* **位置：** 让您控制支持在站点上的可用位置（请务必先嵌入 Campaign SDK）。您可以在整个站点提供支持，也可以根据 URL 指定应包含或排除的页面。
* **邀请：** 用户如何在您企业的网站或应用上启动或打开您的呼叫中心。邀请有两种类型：Sticky 和 Embedded。
  * **悬浮：** 邀请用户使用您的数字支持的一种简单方式。用户会在屏幕上看到一个图标或小组件，点击后会打开支持体验。您可以控制颜色、形状和图标，甚至添加文本。
  * **嵌入式：** 通过嵌入式邀请，您可以将网站上的任何按钮或链接转换为可点击链接，从而打开支持。
* **主动消息：** 当用户访问指定页面达到指定时长后，您可以用来发送消息的问候语。使用悬浮式邀请类型的任何 Campaign 都可以添加主动消息。

  **例如：** “需要帮助选择套餐吗？”

此外，您还将设置一个 **头像**，它是机器人或客服的图像表示。您的用户将看到这些代表您品牌的机器人或客服头像。

### 构建您的聊天体验

了解更多关于构建聊天体验的信息，包括尺寸、图像、设计、发送消息以及其他配置设置。

{% content-ref url="/pages/0f8d9bd1a2ffb85f21e5e7717d06bd14e722f852" %}
[构建您的聊天体验](/technical-library/zh/shang-ye-ban-fu-wu/zoom-contact-center/expert-insights/customize-user-chat-support-experience/build-your-chat-experience.md)
{% endcontent-ref %}

### 摘要

Zoom 呼叫中心和 Zoom Virtual Agent 可帮助您创建一个符合品牌且易于使用的支持聊天。您可以完全自定义设计，选择聊天出现的位置和时间，并添加主动消息在合适的时机吸引用户。一旦嵌入 Campaign SDK，您就可以通过管理员界面或代码控制一切。它灵活、简洁，并专为适配您的站点而设计。

您已准备好推出一种既能帮助客户又能代表您品牌的聊天体验。

### 相关资源

* [设置 Zoom 呼叫中心数字活动](https://zoom.us/cci/index/admin#/admin-campaign-management)
* [将 Zoom 呼叫中心功能集成到您的网站中](/technical-library/zh/shang-ye-ban-fu-wu/zoom-contact-center/expert-insights/integrate-zoom-contact-center-features-into-your-website.md)
* [将 Campaign SDK 嵌入到您的网站或移动应用中](https://developers.zoom.us/docs/contact-center/web/chat/#embed-the-chat-client-with-a-campaign-id)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://library.zoom.com/technical-library/zh/shang-ye-ban-fu-wu/zoom-contact-center/expert-insights/customize-user-chat-support-experience.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
