La navigation propiedad en docs.json define cómo los usuarios navegarán por tu documentación. Piensa en ella como el plano de la estructura del menú de tu documentación.

Con una configuración de navegación adecuada, puedes organizar tu contenido en una jerarquía lógica que facilita a los usuarios encontrar exactamente lo que están buscando.

​
Pages

Las páginas son el componente de navegación más fundamental.

Pages es un array donde cada entrada debe ser una referencia a la ruta de un page file.

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

​
Groups

Los grupos te permiten agrupar tus páginas. Los grupos también pueden anidarse entre sí.

{
  "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"]
      }
    ]
  }
}

​
Tabs

Las pestañas ayudan a distinguir entre diferentes temas o secciones de tu documentación.

"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"
    }
  ]
}

​
Anchors

Los anclajes son otra forma de seccionar tu contenido. Aparecen en la parte superior de tu navegación lateral.

La configuración es muy similar a las pestañas.

Aunque no es obligatorio, recomendamos encarecidamente que también establezcas un icon campo icon.

"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"
    }
  ]
}

Los anclajes que contienen estrictamente enlaces externos se pueden lograr usando el global keyword:

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

Los menús desplegables aparecen en el mismo lugar que los anclajes, pero se consolidan en un solo desplegable.

Aunque no es obligatorio, también recomendamos que establezcas un icono para cada elemento del menú desplegable.

"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"
    }
  ]
}

​
Versions

Las versiones se pueden aprovechar para dividir tu navegación en diferentes versiones.

{
  "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"]
          }
        ]
      }
    ]
  }
}

​
Languages

Los idiomas se pueden aprovechar para dividir tu navegación en diferentes idiomas.

Puedes automatizar translations de tu documentación a cualquier idioma compatible.

Actualmente admitimos los siguientes idiomas:

Arabic (ar)

Chinese (cn)

Chinese (zh-Hant)

English (en)

French (fr)

German (de)

Indonesian (id)

Italian (it)

Japanese (jp)

Korean (ko)

Portuguese (pt)

Portuguese (pt-BR)

Russian (ru)

Spanish (es)

Turkish (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"]
          }
        ]
      }
    ]
  }
}

​
Nesting

Es importante tener en cuenta que puedes usar cualquier combinación de anclajes, pestañas y menús desplegables - cualquiera de ellos puede anidarse dentro de los otros de manera intercambiable.

De esta manera, puedes crear una estructura de navegación muy compleja que sea fácil de gestionar.

{
  "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"
            ]
          }
        ]
      }
    ]
  }
}