埋め込みのカスタマイズ

ウェルカムメッセージ、アクションなどを設定して、Docs Embed をプロダクトやアプリに埋め込んだ際の体験をカスタマイズする

〜の後で Docs Embed をあなたのウェブサイトやアプリに追加すると、サイドバーに実行可能なボタンを追加したり、ユーザーにコンテキストに沿った質問を促す提案を表示したりするなど、体験をさらにカスタマイズできます。

ボタンのカスタマイズ(スタンドアロン のみ)

を使用する場合 スタンドアロンのスクリプトタグ実装では、埋め込みウィジェットを起動するボタンのラベルとアイコンをカスタマイズできます。

circle-info

このボタンカスタマイズオプションは、 スタンドアロンのスクリプトタグ実装を使用している場合にのみ利用可能です。For React または Node.js/NPM パッケージ の実装では、埋め込みを起動する独自のボタンを作成する必要があります。

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

利用可能なアイコンオプション:

  • assistant - gitbook-assistant アシスタントアイコン(デフォルト)

  • sparkle - sparkle スパークルアイコン

  • help - circle-question ヘルプ/質問アイコン

  • book - book-open 本のアイコン

アクションの追加

埋め込みにアクションを追加すると、UI 内でユーザーに追加の操作を提供できます。各アクションはラベル、( Font Awesomearrow-up-rightからの)アイコン、および onClick —ユーザーがアクションをクリックしたときに実行されるアクション—で構成されます。追加したアクションはタブと並んでサイドバーに表示されます。アクションは Docs Embed 自体を制御することも、任意のコードを実行することもできます。

提案の追加

提案を Assistant タブに追加できます。これらは Assistant が読み込まれたときにユーザーがクリックして使えるプロンプトとして表示されます。

挨拶の追加

Assistant タブに表示されるウェルカムメッセージをカスタマイズします:

商標の表示または非表示

を使用して trademark 埋め込みUIでGitBookの商標(Docs EmbedフッターおよびAssistantのブランディングを含む)を表示または非表示にします。

タブの設定

表示するタブを上書きします。デフォルトでは、埋め込みはサイトの設定に基づいてタブを表示します。

最終更新

役に立ちましたか?