# 自定义嵌入

在 [将 Docs Embed 添加到您的网站或应用中](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/publishing-documentation/embedding/implementation)之后，您还可以通过添加诸如侧边栏中的可操作按钮、用于通过上下文问题引导用户的建议等内容，进一步自定义体验。

### 自定义按钮（[独立](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/publishing-documentation/embedding/implementation/script) 版）

在使用 [独立脚本标签实现](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/publishing-documentation/embedding/implementation/script)时，您可以自定义启动嵌入式组件的按钮标签和图标。

{% hint style="info" %}
此按钮自定义选项仅在使用 [独立脚本标签实现](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/publishing-documentation/embedding/implementation/script)时可用。对于 [React](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/publishing-documentation/embedding/implementation/react) 或者 [Node.js/NPM 包](https://gitbook-v2-q67etdj25-gitbook.vercel.app/url/gitbook.com/docs/documentation/zh/publishing-documentation/embedding/implementation/nodejs) 实现，您需要创建自己的按钮来启动嵌入。
{% endhint %}

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

**可用的图标选项：**

* `assistant` - <i class="fa-gitbook-assistant">:gitbook-assistant:</i> 助手图标（默认）
* `sparkle` - <i class="fa-sparkle">:sparkle:</i> 闪光图标
* `help` - <i class="fa-circle-question">:circle-question:</i> 帮助/问题图标
* `book` - <i class="fa-book-open">:book-open:</i> 书本图标

### 添加操作

为嵌入添加操作可让您在 UI 中为用户提供额外操作。每个操作都由一个标签、一个图标（来自 [Font Awesome](https://fontawesome.com/search?ip=brands%2Cclassic%2Cduotone)）以及一个 `onClick` 组成，当用户点击该操作时会执行该动作。您添加的任何操作都会与选项卡一起显示在侧边栏中。操作可以控制 Docs Embed 本身，也可以执行您想要的任何代码。

```javascript
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");
      },
    },
  ],
});
```

### 添加建议

您可以向助手选项卡添加建议，当助手加载时，这些建议会以可点击提示的形式显示给用户使用。

```javascript
window.GitBook("configure", {
  suggestions: [
    "帮我开始使用我的新账户",
    "我如何重置密码？",
    "你们的定价方案是什么？",
  ],
});
```

### 添加问候语

自定义在助手选项卡中显示的欢迎消息：

```javascript
window.GitBook("configure", {
  greeting: {
    title: "欢迎！",
    subtitle: "今天我能如何帮助您？",
  },
});
```

### 显示或隐藏商标

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

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

### 配置选项卡

覆盖要显示的选项卡。默认情况下，嵌入内容会根据您网站的配置显示相应的选项卡。

```javascript
window.GitBook("configure", {
  tabs: ["assistant", "docs"], // 显示两个选项卡
  // tabs: ['assistant'], // 仅显示助手选项卡
  // tabs: ['docs'], // 仅显示文档选项卡
});
```
