如何将 ElevenLabs 对话式 AI 小组件添加到 Wix 网站

想提升 客户支持 和 用户互动，只需为 Wix 网站添加 ElevenLabs 的 对话式 AI。你来对地方了。本指南将带你逐步完成整个流程，帮你避开常见问题。

开始前须知

开始前，请确保准备好以下内容：

1. Wix 高级账户：仅高级套餐支持嵌入自定义 JavaScript。
2. ElevenLabs 账户：需要 ElevenLabs 账户才能创建对话式 AI 语音智能体. 立即注册.
3. 可用 Dev Mode 的 Wix 编辑器权限：需启用 Dev Mode 才能添加自定义代码。

操作步骤

步骤 1：准备 ElevenLabs 小组件

1. 登录 ElevenLabs 账户。
2. 进入对话式 AI 页面。
3. 设置对话智能体，并复制提供的 JavaScript 嵌入代码。

步骤 2：在 Wix 启用 Dev Mode

1. 在编辑器中打开 Wix 网站。
2. 点击顶部菜单的 Dev Mode，启用添加自定义代码等高级功能。

注意：如未看到 Dev Mode，请确认使用的是完整 Wix 编辑器，而非 Wix ADI（智能设计）。

步骤 3：添加 JavaScript 嵌入代码

1. 在 Wix 编辑器进入 设置 > 自定义代码。
2. 点击 + 添加自定义代码。
3. 将 ElevenLabs JavaScript 代码粘贴到指定区域。
4. 在“应用代码到”中选择所有页面（或为小组件选择特定页面）。
5. 保存并发布更改。

常见问题与排查

添加对话式 AI 小组件到 Wix 网站遇到问题？按以下步骤排查解决。

问题 1：小组件断开或无法加载

• 原因：Allowlist 配置错误或使用免费 Wix 套餐。
• 解决方法：请确保网站 URL 已从 Allowlist 移除或在 ElevenLabs 控制台正确配置。

问题 2：JavaScript 无法运行

• 原因：JavaScript 代码未正确添加。
• 解决方法：请再次确认 JavaScript 是否粘贴在 自定义代码.

问题 3：使用免费 Wix 套餐

• 原因：免费 Wix 套餐不支持嵌入自定义 JavaScript。
• 解决方法：升级至 Wix 高级套餐。

进阶技巧

想为访客打造更优体验？可参考以下进阶建议。

调整 Allowlist

如嵌入代码后小组件仍无法使用，请按以下步骤操作：

1. 登录 ElevenLabs 账户。
2. 进入对话式 AI 智能体的 Allowlist 设置。
3. 确保已正确添加网站域名。如仍有问题，可尝试移除域名后重新测试。

正式域名测试

小组件在 Wix 预览模式下可能无法正常工作。请发布网站并在正式域名下测试。

跨浏览器兼容性测试

小组件上线后，请在 Chrome、Firefox、Edge、Safari 等多款浏览器中测试。部分功能因 JavaScript 处理差异，表现可能不同。

1. 分别在各浏览器打开网站。
2. 与小组件交互，检查响应情况。
3. 关注样式错乱或功能异常等问题。如有异常，请检查 JavaScript 代码或联系 ElevenLabs 支持。

移动端适配

确保小组件在手机、平板等移动设备上流畅运行，因大量用户通过移动端访问网站。

1. 使用 Wix 移动编辑器预览移动端布局。
2. 在真实设备上测试小组件，确认功能和易用性。
3. 检查是否有元素重叠或排版问题。如需调整，可用 Wix 移动设计工具优化位置和尺寸。

JavaScript 调试建议

如小组件未按预期工作，可用浏览器开发者工具排查问题。

1. 用浏览器（推荐 Chrome）打开网站。
2. 右键页面任意位置，选择“检查”打开 DevTools。
3. 进入 Console 标签页，查找与小组件相关的报错信息。
4. 如有报错，请检查 JavaScript 嵌入代码，并确保所有必需 URL 已加入 Allowlist。此方法也可发现依赖缺失或其他导致小组件异常的问题。

结语

将 ElevenLabs 对话式 AI 小组件集成到 Wix 需细致设置，但按步骤操作即可快速上线。请确保使用 Wix 高级套餐，按上述流程操作，并及时排查常见问题。如遇更多问题，可联系 ElevenLabs 支持 获取帮助。

或还未注册，欢迎 立即注册，体验对话式 AI 智能体平台。