---
description: 创建和管理可以嵌入您网站的小部件，以便网站访问者可以通过您选择的渠道与您联系
title: 增长小部件
image: https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2F3f43c48b21b24f4e8b02b100c0c8fab0
---

[新的🔥 抢先尝试 WhatsApp Business Calling API（开放测试版）！![arrow-icon](https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2Fe43213a7a9314673bd8d2060c25f9b87)](/zh/whatsapp-business-calling-api)

帮助我... ⌘ 

1. [All Collections >](/zh/help)
2. [ 产品 >](/zh/help/product)
3. [ 工作区设置 >](/zh/help/workspace-settings)
4. 增长小部件

# 增长小部件

![Avatar](https://assets2-proxy.respond.io/ph8r57dk1q9w/4GvzCieeTBRY4TRJUbIr4y/b92428e6b049d23f546269180534f7ea/Ryan_Tan_Avatar.svg)

Joshua Lim

· 04 Apr 2025

5 分钟

增长小部件允许您在网站上嵌入单通道或多通道小部件，以便访问者可以通过他们喜欢的消息应用程序与您联系。

> 如果您想添加网站聊天小部件，请了解更多信息 [在此处](https://respond.io/zh/help/website-chat-widget/website-chat-widget-overview)。

## 到达这里

> 只有所有者和经理可以访问此设置。

可以从 **设置** 导航菜单的 **工作区设置** 子菜单项、 **增长小部件**访问此设置。

在“增长小部件设置”部分下，您可以看到工作区中现有小部件的列表。 在这里，您可以编辑和管理这些小部件或创建新的小部件。

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/57mm9I3T8Pi7UnYorlg6BA/eb93ab9123b0b352e6ce270e5ce0be09/workspaces-growthw.gif?fm=avif&w=1000) 

在此设置中，您可以：

* 创建小部件
* 管理现有小部件
* 删除小部件

## 创建小部件

**步骤 1：** 单击**添加小部件**按钮以探索所有可用的小部件。

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/1cSEqRmlBANAYqqY5FntFL/da1d2cbc82153ef8a38e9d4dc0a1d524/workspaces-add-widget.png?fm=avif&w=1000) 

**步骤 2：** 选择您想要创建的小部件 > 单击**创建小部件**按钮

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/2v1rbVsIBPfSndSWriVBe5/3b5fb7c19244b4bca71d4840d757063e/workspaces-createw.png?fm=avif&w=1000) 

> 如果通道连接到工作区，您只能选择单通道小部件。

### 配置小部件

根据必填字段配置选定的小部件。

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/4TI7vQA9U7yvcO9RtuCgse/965118031034edb7a1d1bac374f8446d/workspaces-configurew.png?fm=avif&w=1000) 

#### 网站域名

在网站域字段中添加将要添加小部件的网站地址。 以下是将网站列入白名单的方法：

* 如果用户添加`https://app.respond.io`，那么只有`https://app.respond.io`会被列入白名单。 任何其他子域或根都不应起作用。
* 如果用户添加`https://*.respond.io`，则包括根域在内的所有子域都将被列入白名单。
* 如果用户添加`https://respond.io`，则只有根域会被列入白名单。
![](https://assets2-proxy.respond.io/ph8r57dk1q9w/1MMSfFMgRphP35jCbBejTT/8e9eac0f58354013130396de3ecef3ec/websitedomain.gif?fm=avif&w=1000) 

#### 选择你的渠道

从可用频道下拉列表中选择要为其创建小部件的频道。

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/2BDzQ5y4lVIgvRau13PRrC/a818f134ff35c6794dc0b1b9d158f3d6/choosechannels.gif?fm=avif&w=1000) 

#### 高级设置

您可以点击**高级设置**按钮进一步配置可选字段。

* **悬停文本：** 悬停在小部件上时显示
* **预填充文本（可选）：** 发送消息前预填充文本
* **包含当前页面 URL：** 选中此复选框可在预填充文本中包含当前页面 URL

> “包含当前页面 URL”功能仅适用于 WhatsApp、Viber 和电子邮件渠道。

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/1MYLyLozRByTsjbDvrr1aM/8d0620e360d0b6f4535e4eedc610a138/workspaces-advanced-settings.png?fm=avif&w=1000) 

#### 安装脚本

复制生成的脚本以将其安装到您的网站上，然后单击**完成**按钮。 或者，通过电子邮件转发安装说明。

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/sEm4u6WmVilu3Xjfdz0Rv/d6541119d3f441855bb6fe315c1edcaa/growth-widgets-7.png?fm=avif&w=1000) 

> 请参阅这里的 [了解如何在您的网站上安装脚本](https://respond.io/zh/help/website-chat-widget/website-chat-widget#installing%5Fthe%5Fchat%5Fwidget)。

> 完成后，单击右上角的“生成小部件”按钮。

## 管理小部件

创建小部件后，您可以按如下方式管理它。

### 打开安装代码

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/7liJXSQ6a8K0P0AvSlsVsL/00b273a27c309b4972c7d8aec6659876/installation-code.png?fm=avif&w=1000) 

要查看或复制所创建小部件的安装代码（脚本），请单击 **安装代码** 按钮并按照屏幕上的说明进行操作。

> 此功能不适用于二维码生成器。

### 下载二维码

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/2Omh41BIWxCUyCKB5axLfa/f38aa08096e4eef8c0a450d62f374585/qr-code.png?fm=avif&w=1000) 

要下载生成的二维码，请单击 **扫描代码** 按钮，然后单击 **下载** 按钮，并为可扫描代码选择所需的像素尺寸。

> 这仅适用于二维码生成器，不适用于其他消息小部件。

> 有关如何使用此功能的更多信息，请阅读我们关于使用可扫描代码的 [博客文章](https://respond.io/zh/blog/facebook-messenger-code)。

### 自定义小部件

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/7jpBHww29KHkVGZzWNuXJc/d671069da8e50bd7d8009e3b6ccc80f4/customize-widget.png?fm=avif&w=1000) 

要自定义现有小部件，请单击 **自定义** 按钮打开自定义页面。

根据小部件的类型，您可以自定义 5 个部分：

#### **一般的**

您可以配置以下常规设置：

* **小部件名称：** 内部用于识别小部件的名称
* **网站域名：** 要安装小部件的网站。 如果您不将您的网站添加到此列表，您的小部件将不会加载。 如果您计划在多个网站上安装该小部件，则可以输入多个 URL。

#### **频道**

您可以自定义以下内容来根据所选频道定义小部件的行为：

* **悬停文本：** 当悬停在小部件上时，悬停文本会显示在工具提示中。
* **预填充文本：** 预填充文本是联系人开始对话时的输入建议。
* **参考：** 打开对话时会出现参考，并允许您跟踪联系人的来源。
* **颜色：** 选择小部件中频道图标的背景颜色和图标外观。

#### **显示 & 外观**

您可以自定义以下内容来更改网站上小部件的显示外观：

* **弹出消息：** 弹出消息每天在页面加载后 5 秒向网站访问者显示一次。 如果未定义，则不会出现弹出消息。
* **小部件大小：** 从大、标准或小部件大小中选择。
* **显示选项：** 选择在桌面、移动设备或两者上显示此小部件。

#### **位置**

您可以根据以下设置更改网站上小部件的位置：

* **对齐：** 指定您是否希望在网站的左下角还是右下角显示小部件。
* **垂直间距：** 指定小部件和屏幕底部之间的垂直间距量。
* **水平间距：** 指定小部件和屏幕边缘之间的水平间距量。

#### **其他设置**

小部件的额外定制：

* **隐藏 Respond.io 品牌：** 从您的小部件中删除 respond.io 品牌。

## 删除小部件

![](https://assets2-proxy.respond.io/ph8r57dk1q9w/3DMqeOcw4oNk6tMo9n1tXQ/6fc0f30860447ebccfa8c7dd80a4d21c/delete-widget.png?fm=avif&w=1000) 

要删除现有小部件，请单击 **删除** 按钮并按照屏幕上的说明进行操作。 这样做将从您的工作区中完全删除该小部件。

> 从工作区中删除小部件时要小心。 当一个小部件被删除时，它的所有配置都将被删除。 删除操作无法撤消。

分享这篇文章

[![Telegram](https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2F44daca77a4844f0c8fd29040ddeba057?width=22)](https://api.whatsapp.com/send?text=https://respond.io/help/workspace-settings/growth-widgets)[![Facebook](https://assets1-proxy.respond.io/api/v1/image/assets/11f7a662b80a4675973850b067c01fa5/fff57eeb01160bc604392f519b4f3461ca16f0fa1b6a587b20b142cdf1ad0ba7?placeholderIfAbsent=true&width=22)](https://www.facebook.com/sharer/sharer.php?u=https://respond.io/help/workspace-settings/growth-widgets)[![Linkedin](https://assets1-proxy.respond.io/api/v1/image/assets/11f7a662b80a4675973850b067c01fa5/7aaf8d87b5410844d83e06a4ed663e4f551b8c5ef51dbb20a8ff064a1eed9a0f?placeholderIfAbsent=true&width=22)](https://www.linkedin.com/sharing/share-offsite/?url=https://respond.io/help/workspace-settings/growth-widgets)[![Twitter](https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2F4e03e02422a94e8eab9b8b41457c2371?width=22)](http://twitter.com/share?url=https://respond.io/help/workspace-settings/growth-widgets)

## 

相关文章 :woman\_technologist：

* [呼叫了解如何管理您已连接的呼叫频道的呼叫配置。 ](/zh/help/workspace-settings/calls)
* [AI提示了解如何设置和配置 AI 提示。 ](/zh/help/workspace-settings/ai-prompts)
* [人工智能辅助了解如何设置和配置 AI Assist。 ](/zh/help/workspace-settings/ai-assist)
* [生命周期学习如何在我们的平台上追踪和管理联系人，以顺利完成销售流程。 ](/zh/help/workspace-settings/workspace-settings-lifecycle)
* [联系人导入学习如何导入、审查和管理平台中的数据。 ](/zh/help/workspace-settings/data-import)

找不到您正在寻找的东西？ 🔎

[联系客服支持](/zh/contact-us)

2025-12-05T04:06:32.234Z

help

```json
[{"@context":"https://schema.org","@type":"TechArticle","articleBody":"创建和管理可以嵌入您网站的小部件，以便网站访问者可以通过您选择的渠道与您联系","author":{"@type":"Person","image":"https://assets2-proxy.respond.io/ph8r57dk1q9w/4GvzCieeTBRY4TRJUbIr4y/b92428e6b049d23f546269180534f7ea/Ryan_Tan_Avatar.svg","name":"Joshua Lim","url":"https://respond.io/zh/author"},"dateCreated":"2025-01-28T04:11:59.000Z","dateModified":"2025-04-04T10:14:25.056Z","datePublished":"2025-01-28T04:11:59.000Z","headline":"增长小部件","image":"https://assets2-proxy.respond.io/ph8r57dk1q9w/57mm9I3T8Pi7UnYorlg6BA/eb93ab9123b0b352e6ce270e5ce0be09/workspaces-growthw.gif","mainEntityOfPage":"https://respond.io/zh/help/workspace-settings","publisher":{"@type":"Organization","logo":"https://respond.io/favicon/favicon.svg","name":"respondio"},"thumbnailUrl":"https://assets2-proxy.respond.io/ph8r57dk1q9w/57mm9I3T8Pi7UnYorlg6BA/eb93ab9123b0b352e6ce270e5ce0be09/workspaces-growthw.gif","url":"https://respond.io/zh/help/workspace-settings/growth-widgets"},{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","name":"Help","item":"https://respond.io/zh/help","position":1},{"@type":"ListItem","name":"产品","item":"https://respond.io/zh/help/product","position":2},{"@type":"ListItem","name":"工作区设置","item":"https://respond.io/zh/help/workspace-settings","position":3},{"@type":"ListItem","name":"增长小部件","item":"https://respond.io/zh/help/workspace-settings/growth-widgets","position":4}]}]
```
