大多数 Support 管理员并不是网站开发者，而是与他人合作，实施对 Web Widget 的自定义。他们不会自行自定义 Web Widget 和网站。他们与公司内部的网站开发者合作，或者以合约方式雇用公司外部的开发者来实施更改。

网站开发者负责自定义工作，方法是添加代码（Web Widget API）到网站的 HTML 中。然而，管理员仍在此工作中起着重要的作用。他们需要了解 Web Widget 可以进行哪些自定义，并告诉网站开发者其所需的内容。

一些管理员具有 HTML 方面的经验，选择自行进行自定义工作，自己担任开发者的角色，这完全没有问题。无论如何，Web Widget 的自定义实际上是一个需要管理员进行规划，并包含以下步骤的过程：

1. 查阅这篇文章中的信息，了解可以进行哪些高级自定义。
2. 与公司中的关键利益干系人会谈，创建一个 Web Widget 要求列表。您想使用哪些颜色？您希望 Web Widget 具有怎样的行为方式？
3. 准备一个您想要的自定义列表。请尽可能详细，并加入可供您的网站开发者参考的 API 文档。
4. 把列表给您的网站开发者，他们会通过修改您网站的 HTML 来自定义 Web Widget。

这里有一些重要的信息，可帮助开发者浏览 Zendesk 开发者网站上的 Web Widget API 文档。

全新 API 语法 —— Web Widget API 语法已更改。如需了解更多关于此更改的信息，请参阅《全新已改进的高级 Web Widget JavaScript API 发布公告》。

已更新且整齐有序的开发者文档 —— 我们还重新整理了 Web Widget API 开发者文档，使您可更方便地找到所需的命令或设置。文档现已根据产品渠道（帮助中心、工单、Chat 和 Talk）或根据核心设置与命令进行组织。如需更多信息，请参阅《Web Widget API 的开发者文档》。

全新 Chat API —— 如需关于如何将旧的 Chat（Zopim）API 映射至新的 Web Widget API 的信息，请参阅《从 Chat 小组件语法迁移到统一的 Web Widget 语法》。

Web Widget 默认以终端用户的语言显示文本，根据的是该用户浏览器的语言。例如，如果终端用户浏览器的语言设置为德语（de），则小组件将对该用户以德语显示。

Web Widget 支持 Zendesk 支持的语言的子集。如果终端用户的浏览器语言不受 Web Widget 支持，则小组件默认显示为英语。如果小组件无法从终端用户的浏览器得知其语言，则小组件默认以 Zendesk Support 中指定的语言显示。

您可以自定义小组件，使其始终以特定语言显示，方法是使用 setLocale 命令。此命令仅设置小组件的语言，不会替代您主页面的语言。

如需更多信息，请查阅关于 setLocale 命令的开发者文档。

您可以通过在联系表格中预填姓名、电邮地址和电话号码，节省您的网站访问者时间，避免引起其厌烦。其中包括工单表格、交谈前的表格，以及 Chat 离线表格。使用 identify 和 prefill 设置。

您还可以使用 prefill 设置来将用户信息设置为只读，这是一个很好的功能，因为这样您就可以避免在 Support 中为同一个人建立重复的用户帐户。

如需更多信息，请查阅关于 identify 和 prefill 设置的开发者文档。

如果您已对工单启用附件，则用户默认可以附加文件到提交自 Web Widget 的工单中。然而，您也可以按需禁用此选项。

如需更多信息，请查阅关于 contactForm 对象的 attachments 设置的开发者文档。

Web Widget 的默认位置位于浏览器的右下角；当用户单击 Web Widget 时，它会向上展开。

您可以根据不同的页面，选择不同的 Web Widget 位置（可放置在页面的左边或右边，或移到页面的顶部，单击后向下展开）。使用 position 设置将 Web Widget 放到页面的左上角、右上角、左下角或右下角。

如需更多信息，请查阅关于 position 设置的开发者文档。

您可以使用 offset 设置调整 Web Widget 在您的桌面或移动设备中的位置。使用初始 position 设置作为参考点，然后使用 offset 设置从该位置水平、垂直，或水平并垂直移动 Web Widget（以像素为单位）。

如需更多信息，请查阅关于 offset 设置的开发者文档。

您可以从 Web Widget 管理页面指定 Web Widget 的整体配色方案（主题颜色），以及用于启动器、联系按钮和页首中的文本的自定义颜色（主题文本颜色）（请参阅《配置 Web Widget 中的组件》）。

然而，如果您要自定义特定的元素，则需要使用 color 设置。您可以为每个 Web Widget 组件选择独特的颜色：

• 启动器
• 按钮
• 按钮文本
• 结果列表
• 页首
• 文章链接

出于对无障碍设计的考虑，Web Widget 会使用算法来自动调整颜色，以确保符合 WCAG 指南规定的最小对比度比率。

如需了解更多关于自定义 Web Widget 元素颜色的信息，请查阅关于 color 设置的开发者文档。

您可以使用 zIndex设置（这是一个核心 Web Widget 设置）来设置新值，更改 Web Widget 对比您的网站中相同位置的其它元素，所具有的显示方式。

如需更多信息，请查阅关于 zIndex 设置的开发者文档。

您可以启用 Web Widget 中的联系表格、Chat、Talk 和帮助中心，然后使用 suppress 设置来更改您的网站中特定页面所提供的功能，以符合您的需求。

如需更多信息，请查阅关于 suppress 设置的开发者文档。

您可以更改下表中的 Web Widget 组件的文本，也可以自定义帮助中心搜索占位符文本。

组件	详情
	对象：launcher 设置：chatLabel 描述：当 Chat 已启用且帮助中心未启用时，启动器按钮上的文本 默认文本：Chat
	对象：launcher 设置：label 描述：启动器按钮上的文本 默认文本：帮助、支持或反馈（在 Web Widget 管理员页面中予以定义）
	对象：helpCenter 设置：title 描述：帮助中心页面的标题 默认文本：帮助
	对象：contactForm 设置：title 描述：联系表格的标题 默认文本：给我们留言或联系我们（在 Web Widget 管理员页面中予以定义）
	对象：helpCenter 设置：messageButton 描述：帮助中心表格中的按钮文本，会加载联系表格（限于 20 个字符内） 默认文本：给我们留言或联系我们（在 Web Widget 管理员页面中予以定义）
	对象：helpCenter 设置：chatButton 描述：帮助中心表格中显示的按钮文本，会加载 Chat（限于 20 个字符内） 默认文本：帮助、支持或反馈（在 Web Widget 管理员页面中予以定义）

您可使用 translations 对象来更改 Web Widget 中显示的某些默认文本。翻译根据功能来分组 —— 例如：启动器、帮助中心和联系表格。

您可以在《Zendesk 支持的语言的语言代码》中浏览语言代码列表。

区域设置的翻译根据终端用户的浏览器语言触发。您也可以强制小组件始终以特定语言显示，替代终端用户浏览器的语言设置。如需更多信息，请参阅《以另一种不同的语言显示小组件》。

使用 contactForm 对象中的 subject 设置，您可以设置 Web Widget 以便在默认联系表格中包括标题字段。

默认联系表格旨在促进参与，并在用户完成联系表格时，提供精简的用户体验。尽管默认联系表格不包含标题行，您可能想要添加标题行以提升面向某些客户的支持体验。

如需更多信息，请查阅关于 contactForm 对象的 subject 设置的开发者文档。

查看原始文章按钮是连系 Web Widget 中的文章与帮助中心本身的文章的桥梁。您可以使用 originalArticleButton 对象，将其设置为 false，以便隐藏此按钮。

如需更多信息，请查阅关于 helpCenter 对象的 originalArticleButton 设置的开发者文档。

使用 helpCenter 对象的 filter 设置，您可以限制从 Web Widget 对文章根据类别、组别和标签进行的搜索的结果数量。如需更多信息，请查阅关于 filter 设置的开发者文档。

向下滚动以查看更多的示例，它们并未包含在开发者文档中，其中说明了您可以限制搜索结果的方式。

要将搜索限制在一个特定的组别中：

<script type="text/JavaScript">
window.zESettings = {
  webWidget: {
    helpCenter: {
      filter: {
        section: '200154474-Announcements'
      }
    }
  }
};
</script>

要将搜索限制在一个特定的类别中：

<script type="text/JavaScript">
window.zESettings = {
  webWidget: {
    helpCenter: {
      filter: {
        category: '200053794-General'
      }
    }
  }
};
</script>

要将搜索限制在多个类别的内容中：

<script type="text/JavaScript">
window.zESettings = {
  webWidget: {
    helpCenter: {
      filter: {
        category: '115000669485,201742209' 
      }
    }
  }
};
</script>

要将搜索限制在带有特定标签的内容中：

<script type="text/JavaScript">
window.zESettings = {
  webWidget: {
    helpCenter: {
      filter: {
        label_names: 'orders'
      }
    }
  }
};
</script>

要将搜索限制在一个特定的类别且带有特定标签的内容中：

<script type="text/JavaScript">
window.zESettings = {
  webWidget: {
    helpCenter: {
      filter: {
        category: '200053794-General',
        label_names: 'Label One,Label Two,Label Three'
      }
    }
  }
};
</script>

帮助中心搜索框中的默认占位符文本为“需要帮助吗？”您可以自定义此文本，使其匹配用户的语言，或者使特定的文本以某些语言显示。如需更多信息，请查阅关于 searchPlaceholder 设置的开发者文档。

如果有上下文的帮助已启用，您也可以配置 Web Widget 打开推荐文章，使您的客户更易于进行自助服务。如需更多信息，请查阅关于 helpCenter 对象的 setSuggestions 命令的开发者文档。

您可以创建多个配置，以定义 Talk 在 Web Widget 中的行为方式。通过各个配置，您可以根据您的需求和偏好，自定义 Web Widget 中的 Talk 的呼叫转移和显示选项。

如果您只在 Web Widget 中创建了一个 Talk 配置，则其将自动成为默认配置，当 Talk 可用时，显示在 Web Widget 中。

如果您在 Web Widget 中创建了多个 Talk 配置，则您可以使用 Talk 的“nickname”设置来定位所需的配置。

如需更多信息，请查阅关于 talk 对象、nickname 设置的开发者文档，以及《配置 Zendesk Talk 设置以用于 Web Widget》。

您可以添加 Zendesk Chat 功能到 Web Widget 中，以便使您的网站访问者与专员进行在线交谈，以及发送和接收有助于解决其问题的文件。专员也可主动发送消息给访问者，看看访问者是否需要任何帮助。

如需更多信息，请查阅关于 chat 对象的开发者文档。

新功能

Zendesk 正在将 Chat 功能添加到 Web Widget 中，该功能以前仅在旧版的 Chat（Zopim）小组件中可用。要使用这些新功能，您必须使用全新的 Web Widget 整合的 Chat 体验。

如需更多关于这些更改的信息，请参阅《从这里开始：Web Widget 整合的 Chat 体验 —— 早期试用计划（EAP）》。

如需关于如何将旧的 Chat（Zopim）API 映射至新的 Web Widget API 的信息，请参阅《从 Chat 小组件语法迁移到统一的 Web Widget 语法》。

您可允许终端用户选择一个联系选项。您可能需要对网站进行自定义，使某些页面允许终端用户进行选择，某些页面不允许。确切的行为取决于 Chat 或 Talk 是否已配置用于 Web Widget，以及是否有可交谈专员在线。您可按需自定义联系选项的默认文本。

以下是默认文本列表：

如需更多信息，请查阅关于 contactOptions 设置的开发者文档。

通过 Chat 提供联系选项

如果 Chat 已配置用于 Web Widget，终端用户将自动转接到在线交谈中，如果有可交谈专员有空的话。然而，您可允许终端用户选择是与专员在线交谈还是完成联系表格，即使有可交谈专员有空。如果当用户单击启动器时有可交谈专员有空，但专员在在线交谈开始之前就退出了，则终端用户可能会看到一条消息，表明专员没空。

这是一个已知问题 —— 当终端用户选择进行在线交谈时，他们无法使用返回按钮回到其它联系选项。要这样做，他们必须完全退出在线交谈，或刷新页面。

通过 Talk 提供联系选项

如果 Talk 和其它联系选项已在 Web Widget 中启用，并且有专员在线，则联系选项将自动启用。

特定用于联系表格、帮助中心和 Zendesk Chat 的项目位于您网站 HTML 中的对应标题（contactForm、helpCenter 和 chat）下，而全局项目则单独列出。

<script type="text/JavaScript">
window.zESettings = {
  webWidget: {
    offset: { horizontal: '400px', vertical: '400px' },
    helpCenter: {
      originalArticleButton: false,
      title: {
        'en-US': 'Search for help',
        '*': 'Have your say'
      }
    },
    chat: {
      suppress: true
    },
    contactForm: {
      title: {
        'en-US': 'SMessage us',
        '*': 'Contact us'
      }
    },
    launcher: {
      label: {
        'en-US': 'Make a request',
        '*': 'Get help'
      }
    }
  }
};
</script>