# GitBook UI

GitBook は、作成したコンテンツを整理・管理しやすくするために、さまざまなセクションに分かれています。

### サイドバー

<div data-with-frame="true"><figure><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2FMINl0qBtvGV3pt8G3bnZ%2FCleanShot%202025-12-10%20at%2010.02.40.png?alt=media&#x26;token=57f3871d-67b0-432e-b646-8b5e5a073aaa" alt=""><figcaption><p>GitBook のサイドバーには、すべてのドキュメントに加えて、通知、検索バー、スニペットなどが含まれています。</p></figcaption></figure></div>

サイドバーを使うと、GitBook 組織の全体像をひと目で把握できます。サイドバーには次のものが含まれます:

* **組織の切り替え**\
  複数の組織に参加している場合、ここでそれらを確認して切り替えできます。このメニューから新しい組織を作成することもできます。
* **通知**\
  コメントや会話でタグ付けされたとき、または作業中のスペースで重要なアクティビティがあると、 [通知](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/collaboration/notifications) が届き、新着情報を知らせてくれます。
* **質問または検索**\
  提供: [GitBook AI](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/searching-your-content/gitbook-ai)。自然言語で質問したり、組織内のさまざまなスペースやコンテンツを検索したりできます。
* **ホーム**\
  ホームページでは、チームが取り組んでいるすべての内容をひと目で確認できます。保留中の変更リクエスト、ディスカッションやコメント、最近のページ編集などを表示できます。
* **Docs サイトのホーム**\
  これをクリックすると、組織内で作成したすべての docs サイトの概要ページに移動します。
* **連携**\
  GitBook [連携](https://github.com/GitbookIO/public-docs/blob/main/content-editor/editor/broken-reference/README.md) はコンテンツを強化し、ページ内により多くを埋め込んだり、他のアプリからナレッジベースに情報を追加したりできるようにします。
* **Docs サイト**\
  このセクションを切り替えると、 [docs サイト](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/publishing-documentation/publish-a-docs-site) をサイドバー内でそのまま確認でき、クリックひとつで移動できます。
* **スペース**\
  スペース セクションでは、 [コレクション](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/content-structure/collection) 、 [スペース](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/content-structure/space) が見つかります。これは、コンテンツを追加するときに作成するものです。詳しくは、 [コンテンツ構造](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/content-structure) のセクションをご覧ください。
* **設定**\
  サイドバーの下部に [個人設定](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/akaunto/account-settings) 、 [組織設定](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/akaunto/organization-settings) があります。ここではライト/ダークモードの切り替えもでき、必要に応じてサポートチームにヘルプを依頼することもできます。
* **ゴミ箱**\
  削除されたスペースはゴミ箱に表示されます。7日間まで復元でき、それ以降は完全に削除されます。

### 目次 <a href="#the-table-of-contents" id="the-table-of-contents"></a>

<div data-with-frame="true"><figure><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2FZYKSwnzcZOkqVA2xgRlX%2FCleanShot%202025-12-10%20at%2010.07.01.png?alt=media&#x26;token=47cb70e3-4cee-4fdd-8247-28a04e75f92e" alt=""><figcaption><p>目次には、選択したスペース内のすべてのページとリンクが一覧表示されます。</p></figcaption></figure></div>

既定では、目次には次の一覧が表示されます。 [ページ、リンク、グループ](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/content-structure/page#organizing-your-content) これらはスペースを構成する要素です。サイドバーの右側に表示されます。現在表示しているスペースに固有のものです。

目次では、次のものを表示・管理することもできます。 [再利用可能なコンテンツ](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/reusable-content) 、 [ファイル](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/blocks/insert-files) をスペース用に。

目次の **ページ** タブから、次のことができます:

* 新しい [ページ](#pages) とサブページを作成
* ページグループを作成 [外部リンクを作成](#groups)
* 追加する [外部リンク](#external-links)
* アクセス [アクションメニュー](#the-actions-menu) <picture><source srcset="broken-reference" media="(prefers-color-scheme: dark)"><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2F89MTSo5XRpPMVr1T0rxS%2Factions.svg?alt=media&#x26;token=2b5d001e-560a-4f29-8d22-de8163725ca1" alt=""></picture> を個々のページに対して使用できます。

の中で **ライブラリ** タブでは、次のことができます:

* スペース内の再利用可能なコンテンツ、変数、画像、ファイルを表示・検索する
* 他のスペースの再利用可能なコンテンツを表示して挿入する
* ライブラリで新しい項目を作成またはインポートする
* ライブラリの項目をページへドラッグ＆ドロップする
* 任意のライブラリ項目はダブルクリックで名前を変更する
* 画像をプレビューする
* 画像とファイルを管理してダウンロードする

目次、特にライブラリタブでできることを示す短い動画はこちらです:

{% embed url="<https://youtu.be/gg-VZP2wl-I>" %}

ページの内容にもっと集中したい場合は、カーソルを近くに合わせて表示される **非表示** ボタン <picture><source srcset="broken-reference" media="(prefers-color-scheme: dark)"><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2F0goJ97jfVBvH656kUK0d%2Fpanel%20left.svg?alt=media&#x26;token=cb31d43b-804c-4c4f-b5bb-e71db0d03860" alt="The Hide button icon in GitBook"></picture> をクリックすると、目次を一時的に隠せます。再び表示するには、ページの端の近くにカーソルを合わせて **表示** ボタン <picture><source srcset="broken-reference" media="(prefers-color-scheme: dark)"><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2FwOFmEqy96fMvDPjqjAED%2Fpanel%20right.svg?alt=media&#x26;token=2f39279a-cd05-48a3-8985-d07ec08663ba" alt="The Show button icon in GitBook"></picture>.

### スペースヘッダー

<div data-with-frame="true"><figure><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2F2Z5NSb3mmbMRoWqONncm%2FCleanShot%202025-12-10%20at%2010.08.48.png?alt=media&#x26;token=da8f53b3-d134-46e1-84d1-db3c1e1eb3cd" alt=""><figcaption><p>スペースヘッダーはエディターの上部にあり、スペース全体に適用されるオプションを提供します。</p></figcaption></figure></div>

スペースヘッダーには、現在表示しているスペースに関する情報が含まれます。スペースの公開や共有、スペースのコメントや履歴の表示、GitHub または GitLab の同期設定などができます。 [GitHub または GitLab の同期](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/getting-started/git-sync)などを使って、デフォルト設定をカスタマイズおよび上書きできます。

{% hint style="info" %}
**スペースヘッダーは柔軟に**変化し、現在いるスペースやモードによって表示が変わります。

たとえば、 [変更リクエスト](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/collaboration/change-requests)を編集中の場合、変更リクエストの概要とともに、エディターを開く、変更を表示する、変更リクエストをマージするためのオプションが表示されます。

読み取り専用のスペースを表示している場合、ライブ編集はロックされているため、ページの内容を編集するには新しい変更リクエストを開く必要があります。
{% endhint %}

<div data-with-frame="true"><figure><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2FrTr3IxB9SPupw4YedgqL%2FCleanShot%202025-12-10%20at%2010.11.01.png?alt=media&#x26;token=772809ef-1b4b-453f-9ce4-64883cfc292c" alt=""><figcaption><p>変更リクエスト内のスペースヘッダー。</p></figcaption></figure></div>

スペースヘッダーには次のものが含まれます:

* **スペースの絵文字またはアイコン**\
  サイドバーで見分けやすくするために、スペース用の絵文字またはアイコンを選べます。
* **スペース名**\
  サイドバーに表示されるスペースの名前で、公開を選択した場合はドキュメントにも表示されます。
* **スペースのパンくず**\
  スペースが含まれるコレクションまたは docs サイトの完全な階層リストです。
* **アクションメニュー** <picture><source srcset="broken-reference" media="(prefers-color-scheme: dark)"><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2FPnnI41SqLSaKBNwT98fW%2Factions-horizontal.svg?alt=media&#x26;token=99754200-a354-4ffe-931e-aa6322ea7395" alt="The Actions menu icon in GitBook"></picture>

  スペースに対するアクションの一覧を表示します。 [ページアクション](#the-actions-menu)と同様に、利用できるスペースのアクションは現在のモードによって異なります。
* **概要**\
  変更リクエストを表示している場合、このタブには参加者とレビュー担当者に加えて、変更リクエストのタイトルと説明が表示されます。また、すべての変更とコメントも表示されます。
* **エディター表示**\
  この表示では、GitBook のブロックベースのエディターを使ってコンテンツを編集できます。
* **変更表示**\
  この表示では [変更がハイライト表示され、](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/collaboration/change-requests#diff-mode) 差分表示を使って変更リクエスト内で行われた変更を確認できます。変更リクエストをマージして変更を本番反映する前に、新しいコンテンツをレビューするのに最適です。
* **プレビュー**\
  この表示では、変更リクエストをマージする前にコンテンツのプレビューをすばやく確認できます。
* **共同編集者**\
  現在あなたのスペース内のページを閲覧している他のユーザーのアバターです。色付きの円でカーソルの色を示します。アバターをクリックすると、そのユーザーが現在表示しているページに移動します。
* **Git Sync の設定**\
  この [GitHub と GitLab の同期](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/getting-started/git-sync) をスペースに設定します。
* **共有メニュー**\
  スペースを公開して共有できます。また、このメニューから他の人を [共同作業](https://github.com/GitbookIO/public-docs/blob/main/content-editor/editor/broken-reference/README.md) に招待することもできます。
* **変数**\
  [再利用可能な変数を作成して追加する](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/variables-and-expressions) スペース内で使用できます。
* **GitBook エージェント**\
  スペース内の変更について [GitBook エージェント](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/gitbook-jento).
* **コメント**\
  コンポーネントの props と [コメントやディスカッション](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/collaboration/comments) を使って、あなたやチームが行った内容についてやり取りできます。
* **変更リクエスト**\
  作成、更新、削除 [変更リクエスト](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/collaboration/change-requests) をスペース内で行えます。
* **スペース履歴**\
  表示 [バージョン履歴](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/version-control) で、スペース内で行われたすべての変更、または現在の変更リクエストで行われた変更を時系列で確認できます。
* **編集ボタン**\
  スペースが公開されている場合、または誰かが[ ライブ編集](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/collaboration/live-edits)をロックしている場合、 **編集** ボタンがスペースヘッダーに表示されます。これにより新しい [変更リクエスト](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/collaboration/change-requests) を作成してコンテンツを編集できます。

### サイトヘッダー <a href="#site-headers" id="site-headers"></a>

サイトヘッダーには、現在表示しているサイトに関する情報が含まれます。サイトのインサイトを表示したり、サイトをカスタマイズしたり、設定を変更したり、さまざまなモードや画面サイズでサイトをプレビューしたりできます。連携を設定し、メンバーのアクセスを管理することもできます。

サイトヘッダーには次のものが含まれます:

* **サイト名**\
  サイドバーに表示されるスペースの名前で、公開を選択した場合はドキュメントにも表示されます。
* **サイトのパンくず**\
  メインの Docs サイト画面に戻るリンク。
* **概要**\
  サイトの概要では、URL、公開ステータス、対象読者、コンテンツ、さらに上位レベルのインサイトなど、サイトに関する重要な情報を確認できます。
* **インサイト**\
  この [インサイト パネル](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/publishing-documentation/insights) では、サイトとそのパフォーマンスに関する詳細な分析情報を確認できます。
* **カスタマイズ**\
  ここでは [サイトをカスタマイズ](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/publishing-documentation/customization) でき、自分のロゴ、色、ヘッダーリンクなどを設定できます。
* **設定**\
  次の設定にアクセスできます。 [サイトの設定](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/publishing-documentation/site-settings) で、名前、対象読者、コンテンツ構造、その他のオプションを管理できます。
* **プレビュー**\
  プレビュータブでは、公開したサイトがデスクトップとモバイルでライトモード・ダークモードの両方でどのように表示されるかをすばやく確認できます。
* **連携**\
  このボタンを開くとモーダルが表示され、サイトに [連携](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/lian-xie/install-an-integration) をインストールして設定できます。
* **メンバーアクセス**\
  GitBook アプリで誰がサイトにアクセスできるか、またそれぞれにどんな権限があるかを表示・管理できます。
* **サイトにアクセス**\
  これをクリックすると、公開済みの docs サイトが新しいタブで即座に開きます。このボタンはサイトが公開中の場合にのみ表示されます。

### コンテンツエディター

<div data-with-frame="true"><figure><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2FxpmoPcLU6kfep6QsXlxi%2FCleanShot%202025-12-10%20at%2010.18.49.png?alt=media&#x26;token=af2b3315-f6e0-4a12-b853-1cbbd5e0e0e9" alt=""><figcaption><p>GitBook エディターでコンテンツを書き、ブロックを追加します。</p></figcaption></figure></div>

エディターはスペースの中心部分であり、GitBook 内でコンテンツを書いたり挿入したりできます。マルチプレイヤーに対応しているため、あなたとチームはリアルタイムで変更を共同編集できます。

次のものを挿入できます [コンテンツブロック](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/blocks)、入力 [Markdown](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/formatting/markdown), [埋め込みコンテンツ](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/blocks/embed-a-url)し、変更について [GitBook エージェント](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/gitbook-jento).

変更を作業するだけでなく、ブロックにコメントしたり、チームメイトにタグを付けたりすることもできます。

### ページのタイトルと説明 <a href="#page-title" id="page-title"></a>

各ページの上部で **タイトル**を設定し、任意で **絵文字**を追加し、 **説明**を書くことができます。使用したタイトルは目次に表示され、公開時にはページの URL スラッグになります。

ページの説明は最大200文字で、検索エンジンではページのプレビュー文として使われます。

{% hint style="info" %}
次を選ぶことで、ページの URL スラッグを変更できます。 **ページアクション** <picture><source srcset="broken-reference" media="(prefers-color-scheme: dark)"><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2F89MTSo5XRpPMVr1T0rxS%2Factions.svg?alt=media&#x26;token=2b5d001e-560a-4f29-8d22-de8163725ca1" alt="The Actions menu icon in GitBook"></picture> > **名前を変更**について詳しくは、以下をご覧ください。 [ページアクション](#page-options) 以下
{% endhint %}

### ページアクションメニュー

ページの **アクションメニュー** <picture><source srcset="broken-reference" media="(prefers-color-scheme: dark)"><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2F89MTSo5XRpPMVr1T0rxS%2Factions.svg?alt=media&#x26;token=2b5d001e-560a-4f29-8d22-de8163725ca1" alt="The Actions menu icon in GitBook"></picture> を使うと、ページの複製、名前変更、削除などができます。

次の方法で **アクションメニュー** を開くことができます。 <picture><source srcset="broken-reference" media="(prefers-color-scheme: dark)"><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2F89MTSo5XRpPMVr1T0rxS%2Factions.svg?alt=media&#x26;token=2b5d001e-560a-4f29-8d22-de8163725ca1" alt="The Actions menu icon in GitBook"></picture> サイドバーでページにカーソルを合わせたときに表示されるアイコン、またはページタイトルの横にあるアイコンを使います。

{% hint style="info" %}
利用できるアクションの種類は、現在 [ライブ編集](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/collaboration/live-edits) モードにいるか、 [変更リクエスト](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/collaboration/change-requests).
{% endhint %}

### ページオプション

<div data-with-frame="true"><figure><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2FquMiRmEYl2L5vg76GJWT%2FCleanShot%202025-12-10%20at%2010.24.19.png?alt=media&#x26;token=b29ba1c2-0f5f-4d35-9e40-dcc6a27165d3" alt=""><figcaption><p>この <strong>ページオプション</strong> サイドパネルでは、ドキュメントとナビゲーションのカスタマイズオプションを提供します。</p></figcaption></figure></div>

ページオプションでは、ドキュメントのレイアウトとナビゲーションをカスタマイズできます。ページオプションにアクセスできるのは編集モードの場合のみです。

次の方法で **ページオプション** サイドパネルは、ページの **アクションメニュー** <picture><source srcset="broken-reference" media="(prefers-color-scheme: dark)"><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2F89MTSo5XRpPMVr1T0rxS%2Factions.svg?alt=media&#x26;token=2b5d001e-560a-4f29-8d22-de8163725ca1" alt="The Actions menu icon in GitBook"></picture> を開いて **オプション**を選ぶか、ページのメインタイトルにカーソルを合わせて表示されたら **ページオプション** をクリックすることで開けます。

{% hint style="info" %}
目次を無効にするなどの一部の変更は、公開済みドキュメントにのみ適用され、エディターでは表示されない場合があります。
{% endhint %}

### ページアウトライン

<div data-with-frame="true"><figure><img src="https://4217681718-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNkEGS7hzeqa35sMXQZ4X%2Fuploads%2F29FlwGeQG1m2s6nQ8yBv%2FCleanShot%202025-12-10%20at%2010.26.57.png?alt=media&#x26;token=6b4e1658-1526-4089-bea4-5bfe5f5656e7" alt=""><figcaption><p>ページアウトラインには H1 と H2 の見出しが表示され、個々のページ内の特定のセクションへすばやく移動できます。</p></figcaption></figure></div>

この **ページアウトライン** はエディターの右側にあり、探しているページのセクションへ直接移動しやすくなります。

追加した [見出し](https://gitbook-open-v2-preview.gitbook.workers.dev/url/gitbook.com/docs/documentation/ja-gitbook-documentation/creating-content/blocks/heading) は、ここに表示されるページアウトラインに一覧表示されます。

ページアウトラインは公開サイトにも表示されます。 [**ページオプション**](#page-options) サイドパネル

{% hint style="info" %}
アプリの右側の列が見えない場合、ブラウザーウィンドウの幅が1430ピクセル未満である可能性があります。ページアウトラインを表示して使用するには、ブラウザーウィンドウの幅が少なくとも1430ピクセル必要です。
{% endhint %}
