Saltar al contenido principal
La propiedad navigation en docs.json controla la estructura y la jerarquía de la información de tu documentación. Con una configuración de navegación adecuada, puedes organizar tu contenido para que los usuarios encuentren exactamente lo que buscan.

​
Páginas

Las páginas son el componente de navegación más fundamental. Cada página corresponde a un archivo MDX que compone tu documentación. En el objeto navigation, pages es un array donde cada elemento debe referenciar la ruta a un archivo de página. 
{
  "navigation": {
    "pages": [
      "settings",
      "pages",
      "navigation",
      "themes",
      "custom-domain"
    ]
  }
}

​
Grupos

Usa grupos para organizar la navegación de la barra lateral en secciones. Los grupos pueden anidarse, etiquetarse con etiquetas y personalizarse con iconos. En el objeto navigation, groups es un arreglo donde cada entrada es un objeto que requiere un campo group y un campo pages. Los campos icon, tag y expanded son opcionales. 
{
  "navigation": {
    "groups": [
      {
        "group": "Primeros pasos",
        "icon": "play",
        "expanded": false,
        "pages": [
          "quickstart",
          {
            "group": "Edición",
            "icon": "pencil",
            "pages": [
              "installation",
              "editor"
            ]
          }
        ]
      },
      {
        "group": "Escribiendo contenido",
        "icon": "notebook-text",
        "tag": "NEW",
        "pages": [
          "writing-content/page",
          "writing-content/text"
        ]
      }
    ]
  }
}

​
Estado expandido predeterminado

Configura expanded: true en un grupo para que se muestre expandido de forma predeterminada en la barra lateral de navigation. Esto es útil para resaltar secciones importantes o mejorar la facilidad de descubrimiento del contenido clave. 
{
  "group": "Comenzar",
  "expanded": true,
  "pages": ["quickstart", "installation"]
}

​
Tabs

Tabs crean secciones diferenciadas de tu documentación con rutas de URL separadas. Tabs generan una barra de navegación horizontal en la parte superior de tu documentación que permite a los usuarios cambiar entre secciones. En el objeto navigation, tabs es un arreglo donde cada elemento es un objeto que requiere un campo tab y puede incluir otros campos de navegación como groups, pages, icon o enlaces a páginas externas. 
{
  "navigation": {
    "tabs": [
      {
        "tab": "Referencia de API",
        "icon": "square-terminal",
        "pages": [
          "api-reference/get",
          "api-reference/post",
          "api-reference/delete"
        ]
      },
      {
        "tab": "SDK",
        "icon": "code",
        "pages": [
          "sdk/fetch",
          "sdk/create",
          "sdk/delete"
        ]
      },
      {
        "tab": "Blog",
        "icon": "newspaper",
        "href": "https://external-link.com/blog"
      }
    ]
  }
}
Los menús añaden elementos de navegación desplegables a una Tab. Usa menús para ayudar a los usuarios a ir directamente a páginas específicas dentro de una Tab. En el objeto navigation, menu es un arreglo donde cada entrada es un objeto que requiere un campo item y puede contener otros campos de navegación como groups, pages, icons o enlaces a páginas externas. 
{
  "navigation": {
    "tabs": [
      {
        "tab": "Herramientas para desarrolladores",
        "icon": "square-terminal",
        "menu": [
          {
            "item": "Referencia de API",
            "icon": "rocket",
            "groups": [
              {
                "group": "Endpoints principales",
                "icon": "square-terminal",
                "pages": [
                  "api-reference/get",
                  "api-reference/post",
                  "api-reference/delete"
                ]
              }
            ]
          },
          {
            "item": "SDK",
            "icon": "code",
            "description": "Los SDK se utilizan para interactuar con la API.",
            "pages": [
              "sdk/fetch",
              "sdk/create",
              "sdk/delete"
            ]
          }
        ]
      }
    ]
  }
}

​
Anclas

Las anclas agregan elementos de navegación persistentes en la parte superior de la barra lateral. Úsalas para seccionar tu contenido, ofrecer acceso rápido a recursos externos o crear llamadas a la acción destacadas. En el objeto navigation, anchors es un arreglo en el que cada entrada es un objeto que requiere un campo anchor y puede incluir otros campos de navegación como groups, páginas, iconos o enlaces a páginas externas. 
{
  "navigation": {
    "anchors": [
      {
        "anchor": "Documentación",
        "icon": "book-open",
        "pages": [
          "quickstart",
          "development",
          "navigation"
        ]
      },
      {
        "anchor": "Referencia de la API",
        "icon": "square-terminal",
        "pages": [
          "api-reference/get",
          "api-reference/post",
          "api-reference/delete"
        ]
      },
      {
        "anchor": "Blog",
        "href": "https://external-link.com/blog"
      }
    ]
  }
}
Para los anclajes que dirigen únicamente a enlaces externos, usa la palabra clave global. Los anclajes dentro de un objeto global deben tener un campo href y no pueden apuntar a una ruta relativa. Los anclajes globales son especialmente útiles para enlazar a recursos que no forman parte de tu documentación, pero que deberían estar fácilmente accesibles para tus usuarios, como un blog o un portal de soporte. 
{
  "navigation": {
    "global":  {
      "anchors": [
        {
          "anchor": "Comunidad",
          "icon": "house",
          "href": "https://slack.com"
        },
        {
          "anchor": "Blog",
          "icon": "pencil",
          "href": "https://mintlify.com/blog"
        }
      ]
    },
    "tabs": /*...*/
  }
}
Los menús desplegables están en un menú desplegable en la parte superior de la barra lateral de la navegación. Cada elemento del menú dirige a una sección de tu documentación. En el objeto navigation, dropdowns es un arreglo donde cada entrada es un objeto que requiere el campo dropdown y puede incluir otros campos de navegación como groups, pages, icon, o enlaces a páginas externas. 
{
  "navigation": {
    "dropdowns": [
      {
        "dropdown": "Documentación",
        "icon": "book-open",
        "pages": [
          "quickstart",
          "development",
          "navigation"
        ]
      },
      {
        "dropdown": "Referencia de API",
        "icon": "square-terminal",
        "pages": [
          "api-reference/get",
          "api-reference/post",
          "api-reference/delete"
        ]
      },
      {
        "dropdown": "Blog",
        "href": "https://external-link.com/blog"
      }
    ]
  }
}

​
OpenAPI

Integra especificaciones de OpenAPI directamente en tu estructura de navigation para generar automáticamente la documentación de tu API. Crea secciones de API dedicadas o ubica páginas de endpoints dentro de otros componentes de navigation. Define una especificación de OpenAPI predeterminada en cualquier nivel de tu jerarquía de navigation. Los elementos hijos heredarán esta especificación a menos que definan la suya propia. 
{
  "navigation": {
    "groups": [
      {
        "group": "Referencia de API",
        "openapi": "/path/to/openapi-v1.json",
        "pages": [
          "overview",
          "authentication",
          "GET /users",
          "POST /users",
          {
            "group": "Productos",
            "openapi": "/path/to/openapi-v2.json",
            "pages": [
              "GET /products",
              "POST /products"
            ]
          }
        ]
      }
    ]
  }
}
Para más información sobre cómo hacer referencia a endpoints de OpenAPI en tu documentación, consulta la configuración de OpenAPI.

​
Versiones

Divide tu navigation en diferentes versiones. Las versiones se pueden seleccionar desde un menú desplegable. En el objeto navigation, versions es un array donde cada entrada es un objeto que requiere un campo version y puede contener cualquier otro campo de navigation. 
{
  "navigation": {
    "versions": [
      {
        "version": "1.0.0",
        "groups": [
          {
            "group": "Primeros pasos",
            "pages": ["v1/overview", "v1/quickstart", "v1/development"]
          }
        ]
      },
      {
        "version": "2.0.0",
        "groups": [
          {
            "group": "Primeros pasos",
            "pages": ["v2/overview", "v2/quickstart", "v2/development"]
          }
        ]
      }
    ]
  }
}

​
Idiomas

Divide tu navigation en distintos idiomas. Se pueden seleccionar desde un menú desplegable. En el objeto navigation, languages es un array donde cada elemento es un objeto que requiere el campo language y puede incluir cualquier otro campo de navigation. Actualmente admitimos los siguientes idiomas para la localización:

Arabic (ar)

Chinese (cn)

Chinese (zh-Hant)

English (en)

French (fr)

German (de)

Indonesian (id)

Italian (it)

Japanese (jp)

Korean (ko)

Portuguese (pt-BR)

Russian (ru)

Spanish (es)

Turkish (tr)

{
  "navigation": {
    "languages": [
      {
        "language": "en",
        "groups": [
          {
            "group": "Primeros pasos",
            "pages": ["en/overview", "en/quickstart", "en/development"]
          }
        ]
      },
      {
        "language": "es",
        "groups": [
          {
            "group": "Primeros pasos",
            "pages": ["es/overview", "es/quickstart", "es/development"]
          }
        ]
      }
    ]
  }
}
Para traducciones automatizadas, comunícate con nuestro equipo de ventas para analizar soluciones.

​
Anidación

Puedes usar cualquier combinación de anclas, pestañas y menús desplegables. Los componentes pueden anidarse entre sí de forma intercambiable para crear la estructura de navigation que desees. 
{
  "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"
            ]
          }
        ]
      }
    ]
  }
}
Los breadcrumbs muestran la ruta completa de navegación en la parte superior de las páginas. Algunos temas tienen los breadcrumbs activados de forma predeterminada y otros no. Puedes controlar si los breadcrumbs están activados para tu sitio usando la propiedad styling en tu docs.json. 
"styling": {
  "eyebrows": "breadcrumbs"
}

​
Configuración de interacción

Controla cómo los usuarios interactúan con los elementos de navegación mediante la propiedad interaction en tu docs.json.

​
Habilitar la navegación automática para groups

Cuando un usuario expande un grupo de navigation, algunos temas navegan automáticamente a la primera página del grupo. Puedes anular el comportamiento predeterminado del tema usando la opción drilldown.
  • Establécelo en true para forzar la navegación automática a la primera página cuando se selecciona un grupo de navigation.
  • Establécelo en false para evitar la navegación y solo expandir o contraer el grupo cuando se selecciona.
  • Déjalo sin configurar para usar el comportamiento predeterminado del tema.
"interaction": {
  "drilldown": true  // Forzar la navegación a la primera página cuando un usuario expande un menú desplegable
}
⌘I