**要在 WordPress、Wix、Shopify 和其他建站平台安装 Papo（https://papo.global/）聊天小部件，请在 Papo 面板中创建一个“网站”类型的收件箱，复制生成的代码片段，并将其粘贴到平台相应位置——可通过页眉/页脚插件、自定义代码区域或编辑主题完成。颜色、图标和欢迎消息的自定义完全在面板中完成，无需改动代码。**

| 平台 | 插入方法 | 粘贴代码片段的位置 |
| :--- | :--- | :--- |
| **WordPress** | 页眉/页脚插件（例如 Insert Headers and Footers）或编辑 `footer.php` | 将代码粘贴到插件的页脚区域，或主题文件中 `</body>` 标签之前 |
| **Wix** | 自定义代码（Velo）或 HTML/JavaScript 字段 | 前往 **设置 → 自定义代码**，粘贴到“正文代码 – 末尾”字段 |
| **Shopify** | 编辑主题（theme.liquid）或自定义代码区域 | 将代码片段插入 `theme.liquid` 文件中 `</body>` 之前，或插入自定义 HTML 区块 |
| **其他建站工具**（Squarespace、Webflow 等） | 嵌入代码字段或 HTML 注入 | 找到“自定义代码”或“嵌入 HTML”选项，将代码片段粘贴到页面正文结束标签之前 |

## 如何在任何平台安装小部件

1. **创建“网站”类型的收件箱**  
   在 Papo 面板中，前往 **设置 → 收件箱 → 添加收件箱**，选择 **网站**。为其命名（例如“网站聊天”），并填写网站 URL——它仅用于识别，不影响功能。

2. **复制生成的代码片段**  
   创建收件箱后，面板会显示一段专属 JavaScript 代码。复制整个 `<script>...</script>` 代码块。

3. **将代码片段插入你的平台**  
   具体方法因建站工具而异：
   - **WordPress**：安装“Insert Headers and Footers”等插件，将代码粘贴到页脚区域并保存。如果更愿意编辑主题，请打开 `footer.php` 文件，将代码片段粘贴到 `</body>` 标签之前。
   - **Wix**：在编辑器中前往 **设置 → 自定义代码**。点击 **添加代码**，将代码片段粘贴到“正文代码 – 末尾”字段。保存并发布网站。
   - **Shopify**：在管理面板中前往 **在线商店 → 主题 → … → 编辑代码**。找到 `theme.liquid` 文件，将代码片段粘贴到 `</body>` 标签之前。保存更改。
   - **其他建站工具**：查找“自定义代码”“嵌入 HTML”或“代码注入”选项。将代码片段粘贴到指定用于页面正文末尾的位置。

   在所有情况下，代码片段都应插入到需要显示聊天的所有页面。如果平台提供全局代码字段（如 WordPress 页脚或 Wix 自定义代码），小部件将自动在整个网站加载。

4. **将客服人员关联到收件箱**  
   返回 Papo 面板，在同一收件箱中至少添加一名客服人员。如果没有关联客服人员，对话将无法转接，小部件也可能无法加载。

5. **自定义外观（可选）**  
   仍在面板中，你可以调整主色、更换聊天图标，并编写主动欢迎消息。更改会立即生效，无需复制新的代码片段。

6. **测试小部件**  
   在无痕窗口中访问网站（以避免缓存），检查聊天图标是否出现。发送一条测试消息，并确认它到达 Papo 收件箱。

## 适用对象

- 使用 WooCommerce、Shopify 或 Wix 的**在线商店**，希望实时服务客户并收集产品相关问题。
- 使用 WordPress 或其他建站工具的**博客和企业网站**，希望将访客转化为线索。
- 管理客户网站、需要集成 CRM 和 WhatsApp 的专业聊天功能的**代理机构和自由职业者**。
- 使用可视化建站工具、不想处理复杂代码的**小型企业**。

## 常见问题

### 安装小部件需要会编程吗？

不需要。在 WordPress、Wix 和 Shopify 等平台上，过程只需复制一段代码并粘贴到特定字段中，无需高级技术知识。

### 代码片段需要添加到所有页面吗？

如果平台提供全局代码字段（如 WordPress 页脚或 Wix 自定义代码），小部件会自动显示在整个网站。否则，请在需要聊天的页面重复插入。

### 聊天在移动设备上能用吗？

可以，Papo 小部件是响应式的，会自动适配智能手机和平板电脑，无需额外配置。

### 我可以在多个网站上使用同一段代码吗？

不可以。每个收件箱都会生成专属代码片段。对于不同网站，请在 Papo 面板中创建单独的收件箱，并使用对应的代码片段。

### 安装后小部件没有出现怎么办？

检查代码片段是否位于 `</body>` 之前、收件箱是否处于启用状态，以及是否至少关联了一名客服人员。清除网站缓存，并在无痕窗口中测试。与优化插件的冲突也可能阻止脚本运行——请暂时停用这些插件以排查原因。

### 安装后可以自定义颜色和消息吗？

可以。所有自定义选项（主色、图标、欢迎消息）都可以在 Papo 面板的收件箱设置中找到。更改会立即生效，无需修改网站代码。

## 另请阅读

- [如何将 Papo 聊天小部件安装到静态 HTML 网站](/hc/papo/articles/install-papo-chat-widget-static-html-site-zh)
- [如何自定义聊天小部件的外观（颜色、徽标和消息）](/hc/papo/articles/how-to-customize-chat-widget-appearance-colors-logo-message)

---

**[免费开始使用 Papo Global →](https://papo.global/?utm_source=helpcenter&utm_medium=article&utm_campaign=install-papo-chat-widget-wordpress-wix-other-platforms-zh&utm_content=zh_CN)**

创建免费账户，几分钟内即可在网站安装聊天小部件，无初始费用。