본문으로 건너뛰기
버전: 2.4.3

여러 개의 사이드바 사용하기

You can create a sidebar for each set of Markdown files that you want to group together.

팁

도큐사우루스 사이트가 여러 개의 사이드바를 사용하는 좋은 예입니다.

다음 예제를 참고하세요.

sidebars.js
module.exports = {
  tutorialSidebar: {
    'Category A': ['doc1', 'doc2'],
  },
  apiSidebar: ['doc3', 'doc4'],
};

When browsing doc1 or doc2, the tutorialSidebar will be displayed; when browsing doc3 or doc4, the apiSidebar will be displayed.

Following the example above, if a commonDoc is included in both sidebars:

sidebars.js
module.exports = {
  tutorialSidebar: {
    'Category A': ['doc1', 'doc2', 'commonDoc'],
  },
  apiSidebar: ['doc3', 'doc4', 'commonDoc'],
};

How does Docusaurus know which sidebar to display when browsing commonDoc? 답변은 알 수 없습니다입니다. 어떤 사이드바가 선택될지 보장할 수 없습니다.

문서 Y를 사이드바 X에 추가하면 양방향 바인딩이 만들어집니다. 사이드바 X에는 문서 Y에 대한 링크가 포함되고 문서 Y를 탐색할 때 사이드바 X가 표시됩니다. 하지만 이런 암시적인 바인딩을 깨고 싶은 경우가 있을 수 있습니다.

  1. How do I generate a link to doc Y in sidebar X without making sidebar X displayed on Y? For example, when I include doc Y in multiple sidebars as in the example above, and I want to explicitly tell Docusaurus to display one sidebar?
  2. How do I make sidebar X displayed when browsing doc Y, but sidebar X shouldn't contain the link to Y? For example, when Y is a "doc home page" and the sidebar is purely used for navigation?

Front matter option displayed_sidebar will forcibly set the sidebar association. 같은 예에서 특별한 구성 없이 문서 단축 표기법을 사용할 수 있습니다.

sidebars.js
module.exports = {
  tutorialSidebar: {
    'Category A': ['doc1', 'doc2'],
  },
  apiSidebar: ['doc3', 'doc4'],
};

그리고나서 프런트 매터를 추가합니다.

commonDoc.md
---
displayed_sidebar: apiSidebar
---

Which explicitly tells Docusaurus to display apiSidebar when browsing commonDoc. 같은 방식으로 문서 Y를 포함하지 않는 사이드바 X를 문서 Y에 표시할 수 있습니다.

home.md
---
displayed_sidebar: tutorialSidebar
---

Even when tutorialSidebar doesn't contain a link to home, it will still be displayed when viewing home.

If you set displayed_sidebar: null, no sidebar will be displayed whatsoever on this page, and subsequently, no pagination either.

Generating pagination​

도큐사우루스는 사이드바를 사용해 각 문서 페이지 하단에 "다음", "이전" 같은 페이지 이동 링크를 생성합니다. 표시되는 사이드바를 엄격하게 사용합니다. 연결된 사이드바가 없으면 페이징 영역도 생성되지 않습니다. However, the docs linked as "next" and "previous" are not guaranteed to display the same sidebar: they are included in this sidebar, but in their front matter, they may have a different displayed_sidebar.

If a sidebar is displayed by setting displayed_sidebar front matter, and this sidebar doesn't contain the doc itself, no pagination is displayed.

You can customize pagination with front matter pagination_next and pagination_prev. 다음 사이드바를 참고하세요.

sidebars.js
module.exports = {
  tutorial: [
    'introduction',
    {
      installation: ['windows', 'linux', 'macos'],
    },
    'getting-started',
  ],
};

"windows" 페이지에서 다음 페이지 이동 링크는 "linux"를 가리키지만 이걸 사용할 건 아닙니다. 여러분은 독자가 설치 이후에 "getting started"로 진행하기를 원합니다. 이런 경우에는 수작업으로 페이징 영역을 설정할 수 있습니다.

windows.md
---
pagination_next: getting-started
---

# 윈도우에 설치

You can also disable displaying a pagination link with pagination_next: null or pagination_prev: null.

기본적으로 페이징 영역 라벨은 사이드바 라벨을 사용합니다. You can use the front matter pagination_label to customize how this doc appears in the pagination.

The ref type is identical to the doc type in every way, except that it doesn't participate in generating navigation metadata. 자신을 링크로만 등록합니다. When generating pagination and displaying sidebar, ref items are completely ignored.

여러 사이드바에서 같은 문서로 연결하려는 경우 특히 유용합니다. The document only belongs to one sidebar (the one where it's registered as type: 'doc' or from an autogenerated directory), but its link will appear in all sidebars that it's registered in.

다음 예제를 참고하세요.

sidebars.js
module.exports = {
  tutorialSidebar: {
    'Category A': [
      'doc1',
      'doc2',
      {type: 'ref', id: 'commonDoc'},
      'doc5',
    ],
  },
  apiSidebar: ['doc3', 'doc4', 'commonDoc'],
};
}

You can think of the ref type as the equivalent to doing the following:

  • Setting displayed_sidebar: tutorialSidebar for commonDoc (ref is ignored in sidebar association)
  • Setting pagination_next: doc5 for doc2 and setting pagination_prev: doc2 for doc5 (ref is ignored in pagination generation)