A navegação propriedade em docs.json define como os usuários navegarão pela sua documentação. Pense nisso como o blueprint para a estrutura do menu da sua documentação.

Com a configuração adequada de navegação, você pode organizar seu conteúdo em uma hierarquia lógica que facilita para os usuários encontrarem exatamente o que estão procurando.

​
Páginas

Páginas são o componente de navegação mais fundamental.

Páginas é um array onde cada entrada deve ser uma referência ao caminho de um arquivo de página.

{
  "navigation": {
    "pages": [
      "overview",
      "quickstart",
      "advanced/components",
      "advanced/integrations"
    ]
  }
}

​
Grupos

Grupos permitem que você agrupe suas páginas. Grupos também podem ser aninhados uns dentro dos outros.

{
  "navigation": {
    "groups": [
      {
        "group": "Getting Started",
        "pages": [
          "quickstart",
          {
            "group": "Editing",
            "pages": [
				"installation",
				"editor",
				{
					"group": "Nested group",
					"pages": [
						"navigation",
						"code"
					]
				}
			]
          }
        ]
      },
      {
        "group": "Writing Content",
        "pages": ["writing-content/page", "writing-content/text"]
      }
    ]
  }
}

​
Abas

Abas ajudam a distinguir entre diferentes tópicos ou seções da sua documentação.

"navigation": {
  "tabs": [
    {
      "tab": "API References",
      "pages": [
        "api-reference/get",
        "api-reference/post",
        "api-reference/delete"
      ]
    },
    {
      "tab": "SDKs",
      "pages": [
        "sdk/fetch",
        "sdk/create",
        "sdk/delete",
      ]
    },
    {
      "tab": "Blog",
      "href": "https://external-link.com/blog"
    }
  ]
}

​
Âncoras

Âncoras são outra maneira de seccionar seu conteúdo. Elas aparecem no topo da sua navegação lateral.

A configuração é muito similar às abas.

Embora não seja obrigatório, recomendamos fortemente que você defina um campo icon também.

"navigation": {
  "anchors": [
    {
      "anchor": "Documentation",
      "icon": "book-open",
      "pages": [
        "quickstart",
        "development",
        "navigation"
      ]
    },
    {
      "anchor": "API References",
      "icon": "sqaure-terminal",
      "pages": [
        "api-reference/get",
        "api-reference/post",
        "api-reference/delete"
      ]
    },
    {
      "anchor": "Blog",
      "href": "https://external-link.com/blog"
    }
  ]
}

Âncoras que contêm estritamente links externos podem ser alcançadas usando o global keyword:

"navigation": {
  "global":  {
    "anchors": [
      {
         "anchor": "Community",
         "icon": "house",
         "href": "https://slack.com"
      },
      {
         "anchor": "Blog",
         "icon": "pencil",
         "href": "https://mintlify.com/blog"
      }
    ]
  },
  "tabs": [...]
}

Menus suspensos aparecem no mesmo lugar que as âncoras, mas são consolidados em um único menu suspenso.

Embora não seja obrigatório, também recomendamos que você defina um ícone para cada item do menu suspenso.

"navigation": {
  "dropdowns": [
    {
      "dropdown": "Documentation",
      "icon": "book-open",
      "pages": [
        "quickstart",
        "development",
        "navigation"
      ]
    }
    {
      "dropdown": "API References",
      "icon": "sqaure-terminal",
      "pages": [
        "api-reference/get",
        "api-reference/post",
        "api-reference/delete"
      ]
    }
    {
      "dropdown": "Blog",
      "href": "https://external-link.com/blog"
    }
  ]
}

​
Versões

Versões podem ser aproveitadas para particionar sua navegação em diferentes versões.

{
  "navigation": {
    "versions": [
      {
        "version": "1.0.0",
        "groups": [
          {
            "group": "Getting Started",
            "pages": ["v1/overview", "v1/quickstart", "v1/development"]
          }
        ]
      },
      {
        "version": "2.0.0",
        "groups": [
          {
            "group": "Getting Started",
            "pages": ["v2/overview", "v2/quickstart", "v2/development"]
          }
        ]
      }
    ]
  }
}

​
Idiomas

Idiomas podem ser aproveitados para particionar sua navegação em diferentes idiomas.

Você pode automatizar traduções da sua documentação para qualquer idioma suportado.

Atualmente, suportamos os seguintes idiomas:

Árabe (ar)

Chinês (cn)

Chinês (zh-Hant)

Inglês (en)

Francês (fr)

Alemão (de)

Indonésio (id)

Italiano (it)

Japonês (jp)

Coreano (ko)

Português (pt)

Português (pt-BR)

Russo (ru)

Espanhol (es)

Turco (tr)

{
  "navigation": {
    "languages": [
      {
        "language": "en",
        "groups": [
          {
            "group": "Getting Started",
            "pages": ["en/overview", "en/quickstart", "en/development"]
          }
        ]
      },
      {
        "language": "es",
        "groups": [
          {
            "group": "Getting Started",
            "pages": ["es/overview", "es/quickstart", "es/development"]
          }
        ]
      }
    ]
  }
}

​
Aninhamento

É importante notar que você pode usar qualquer combinação de âncoras, abas e menus suspensos - qualquer um deles pode ser aninhado dentro do outro de forma intercambiável.

Dessa forma, você pode criar uma estrutura de navegação muito complexa que é fácil de gerenciar.

{
  "navigation": {
    "anchors": [
      {
        "anchor": "Anchor 1",
        "groups": [
          {
            "group": "Group 1",
            "pages": [
              "some-folder/file-1",
              "another-folder/file-2"
              "just-a-file"
            ]
          }
        ]
      }
      {
        "anchor": "Anchor 2",
        "groups": [
          {
            "group": "Group 2",
            "pages": [
              "some-other-folder/file-1",
              "various-different-folders/file-2",
              "another-file"
            ]
          }
        ]
      }
    ]
  }
}