自定义 Embed
通过设置欢迎消息、操作等方式,自定义将 Docs Embed 嵌入到你的产品或应用中的体验
在 将 Docs Embed 添加到您的网站或应用中之后,您还可以通过添加诸如侧边栏中的可操作按钮、用于通过上下文问题引导用户的建议等内容,进一步自定义体验。
自定义按钮(独立 版)
在使用 独立脚本标签实现时,您可以自定义启动嵌入式组件的按钮标签和图标。
window.GitBook("configure", {
button: {
label: "询问",
icon: "assistant", // 'assistant' | 'sparkle' | 'help' | 'book'
},
});可用的图标选项:
assistant- 助手图标(默认)sparkle- 闪光图标help- 帮助/问题图标book- 书本图标
添加操作
为嵌入添加操作可让您在 UI 中为用户提供额外操作。每个操作都由一个标签、一个图标(来自 Font Awesome)以及一个 onClick 组成,当用户点击该操作时会执行该动作。您添加的任何操作都会与选项卡一起显示在侧边栏中。操作可以控制 Docs Embed 本身,也可以执行您想要的任何代码。
window.GitBook("configure", {
actions: [
{
label: "联系支持",
icon: "circle-question",
onClick: () => {
window.open("https://support.example.com", "_blank");
},
},
{
label: "文档",
icon: "book",
onClick: () => {
window.open("https://docs.example.com", "_blank");
},
},
],
});添加建议
您可以向助手选项卡添加建议,当助手加载时,这些建议会以可点击提示的形式显示给用户使用。
window.GitBook("configure", {
suggestions: [
"帮我开始使用我的新账户",
"我如何重置密码?",
"你们的定价方案是什么?",
],
});添加问候语
自定义在助手选项卡中显示的欢迎消息:
window.GitBook("configure", {
greeting: {
title: "欢迎!",
subtitle: "今天我能如何帮助您?",
},
});显示或隐藏商标
使用 trademark 以在嵌入式 UI 中显示或隐藏 GitBook 商标——包括 Docs Embed 页脚和 Assistant 品牌标识。
window.GitBook("configure", {
trademark: false,
});配置选项卡
覆盖要显示的选项卡。默认情况下,嵌入内容会根据您网站的配置显示相应的选项卡。
window.GitBook("configure", {
tabs: ["assistant", "docs"], // 显示两个选项卡
// tabs: ['assistant'], // 仅显示助手选项卡
// tabs: ['docs'], // 仅显示文档选项卡
});最后更新于
这有帮助吗?