自定义 Embed

通过设置欢迎消息、操作等，自定义将 Docs Embed 嵌入到产品或应用中的体验

在 将 Docs Embed 添加到您的网站或应用程序后，您还可以通过在侧边栏中添加可执行操作的按钮、提示用户回答上下文问题的建议、标签页等内容，进一步自定义体验。

自定义按钮（仅限独立 ）

使用 独立脚本标签实现时，您可以自定义启动嵌入式小部件的按钮的标签和图标。

此按钮自定义选项仅在使用 独立脚本标签实现时可用。对于 React 或 Node.js/NPM 包 实现，您需要创建自己的按钮来启动嵌入。

window.GitBook("configure", {
  button: {
    label: "Ask",
    icon: "assistant", // 'assistant' | 'sparkle' | 'help' | 'book'
  },
});

可用的图标选项：

• assistant - 助手图标（默认）

• sparkle - 闪光图标

• help - 帮助/问题图标

• book - 书本图标

设置配色方案

默认情况下，嵌入内容会遵循 iframe 的 CSS color-scheme。这会让它自动匹配您的应用主题或浏览器偏好。

如果您想强制使用某种模式，请传入 colorScheme ，无论是在初始化嵌入、构建框架 URL 还是渲染 React 组件时。这不是 configure.

独立脚本

window.GitBook(
  "init",
  { siteURL: "https://docs.company.com" },
  { colorScheme: "dark" }
);

Node.js/NPM

React

添加操作

向嵌入中添加操作，可让您在 UI 中为用户提供额外操作。每个操作由标签、图标（来自 访问）以及一个 onClick 组成，该动作会在用户点击该操作时运行。您添加的任何操作都会与标签页一起显示在侧边栏中。操作可以控制 Docs Embed 本身，也可以执行您想要的任何代码。

window.GitBook("configure", {
  actions: [
    {
      label: "Contact Support",
      icon: "circle-question",
      onClick: () => {
        window.open("https://support.example.com", "_blank");
      },
    },
    {
      label: "Documentation",
      icon: "book",
      onClick: () => {
        window.open("https://docs.example.com", "_blank");
      },
    },
  ],
});

添加建议

您可以将建议添加到助手标签页中，这些建议会在助手加载时显示为可点击的提示，供您的用户使用。

window.GitBook("configure", {
  suggestions: [
    "Help me get started with my new account",
    "How do I reset my password?",
    "What are your pricing plans?",
  ],
});

添加问候语

自定义助手标签页中显示的欢迎消息：

window.GitBook("configure", {
  greeting: {
    title: "Welcome!",
    subtitle: "How can I help you today?",
  },
});

覆盖助手名称

使用 assistantName 以覆盖 UI 中显示的助手名称。

该值最多可包含 32 个字符。

window.GitBook("configure", {
  assistantName: "Support Copilot",
});

显示关闭按钮

使用 closeButton 以在助手内显示关闭按钮。

window.GitBook("configure", {
  closeButton: true,
});

显示或隐藏商标

使用 trademark 以在嵌入 UI 中显示或隐藏 GitBook 商标——包括 Docs Embed 页脚和助手品牌标识。

window.GitBook("configure", {
  trademark: false,
});

配置标签页

覆盖要显示的标签页。默认情况下，只要您的站点支持所有标签页，它们都会启用。例如，如果您的站点未启用助手，它将不会显示。如果您设置 tabs，嵌入内容将只显示你列出的标签页。

window.GitBook("configure", {
  tabs: ["assistant", "search", "docs"], // 显示所有标签页
  // tabs: ["search", "docs"], // 仅显示搜索和文档
  // tabs: ['docs'], // 仅显示文档标签页
});