Saltar al contenido principal
La propiedad navigation en docs.json controla la estructura y la jerarquía de 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 están buscando. Elige un único patrón de organización principal para el nivel raíz de tu navegación. Una vez que hayas elegido tu patrón principal, puedes anidar otros elementos de navegación dentro de él.

​
Páginas

Las páginas son el componente más fundamental de la navegación. Cada página es un archivo MDX en el repositorio de tu documentación. Gráfico decorativo de páginas. En el objeto navigation, pages es un array donde cada entrada debe hacer referencia a la ruta de 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 se pueden anidar entre sí, etiquetar con etiquetas y aplicar estilos con iconos. Gráfico decorativo de grupos. En el objeto navigation, groups es un array en el que 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",
        "pages": [
          "quickstart",
          {
            "group": "Edición",
            "expanded": false,
            "icon": "pencil",
            "pages": [
              "installation",
              "editor"
            ]
          }
        ]
      },
      {
        "group": "Escritura de contenido",
        "icon": "notebook-text",
        "tag": "NEW",
        "pages": [
          "writing-content/page",
          "writing-content/text"
        ]
      }
    ]
  }
}

​
Estado expandido predeterminado

Usa la propiedad expanded para controlar el estado predeterminado de un grupo anidado en la barra lateral de navigation.
  • expanded: true: el grupo se muestra expandido de forma predeterminada.
  • expanded: false o si se omite: el grupo se muestra contraído de forma predeterminada.
La propiedad expanded solo afecta a los grupos anidados (grupos dentro de otros grupos). Los grupos de nivel superior siempre están expandidos y no se pueden contraer.
{
  "group": "Primeros pasos",
  "pages": [
    "quickstart",
    {
      "group": "Avanzado",
      "expanded": false,
      "pages": ["installation", "configuration"]
    }
  ]
}

​
Tabs

Las Tabs crean secciones diferenciadas de tu documentación con rutas de URL independientes. Las Tabs generan una barra de navegación horizontal en la parte superior de tu documentación que permite a los usuarios cambiar entre secciones. Gráfico decorativo de una navegación por pestañas. En el objeto navigation, tabs es un array donde cada entrada es un objeto que requiere un campo tab y puede contener 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 los 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 array donde cada entrada es un objeto que requiere un campo item y puede incluir otros campos de navegación como groups, pages, icon o enlaces a páginas externas. Los elementos de menú solo pueden contener groups, pages y enlaces externos. 
{
  "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 añaden elementos de navegación persistentes en la parte superior de tu barra lateral. Usa anclas para dividir tu contenido, ofrecer acceso rápido a recursos externos o crear llamadas a la acción destacadas. Gráfico decorativo de una navegación con anclas. En el objeto navigation, anchors es un array donde cada entrada es un objeto que requiere un campo anchor y puede contener otros campos de navegación como groups, pages, icons 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"
      }
    ]
  }
}

​
Anclajes globales

Usa anclajes globales para enlaces externos que deben aparecer en todas las páginas, independientemente de qué sección de tu navigation esté viendo el usuario. Los anclajes globales son especialmente útiles para vincular recursos fuera de tu documentación, como un blog, un foro de la comunidad o un portal de soporte.
Las anclas globales deben incluir un campo href que apunte a una URL externa. No pueden contener rutas relativas.
{
  "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 se encuentran en un menú desplegable en la parte superior de la barra lateral de tu navigation. Cada elemento de un menú desplegable dirige a una sección de tu documentación. Gráfico decorativo de una navigation con menú desplegable. En el objeto navigation, dropdowns es un array donde cada entrada es un objeto que requiere un campo dropdown y puede contener otros campos de navegación como groups, pages, icons 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"
      }
    ]
  }
}

​
Productos

Gráfico decorativo de un selector de productos. Los productos crean una sección de navegación dedicada para organizar la documentación específica de cada producto. Usa productos para separar distintas ofertas, servicios o conjuntos de funciones principales dentro de tu documentación. En el objeto navigation, products es un arreglo donde cada entrada es un objeto que requiere un campo product y puede contener otros campos de navegación como groups, pages, icons o enlaces a páginas externas. 
{
  "navigation": {
    "products": [
      {
        "product": "Core API",
        "description": "Descripción de la API principal",    
        "icon": "api",
        "groups": [
          {
            "group": "Primeros pasos",
            "pages": [
              "core-api/quickstart",
              "core-api/authentication"
            ]
          },
          {
            "group": "Endpoints",
            "pages": [
              "core-api/users",
              "core-api/orders"
            ]
          }
        ]
      },
      {
        "product": "Plataforma de Analytics",
        "description": "Descripción de la Plataforma de Analytics",
        "icon": "chart-bar",
        "pages": [
          "analytics/overview",
          "analytics/dashboard",
          "analytics/reports"
        ]
      },
      {
        "product": "SDK móvil",
        "description": "Descripción del SDK móvil",
        "icon": "smartphone",
        "href": "https://mobile-sdk-docs.example.com"
      }
    ]
  }
}

​
OpenAPI

Integra especificaciones de OpenAPI directamente en la estructura de navegación para generar automáticamente la documentación de tu API. Crea secciones de API dedicadas o coloca páginas de endpoints dentro de otros componentes de navegación. Configura una especificación de OpenAPI predeterminada en cualquier nivel de tu jerarquía de navegación. Los elementos secundarios heredarán esta especificación a menos que definan la suya propia.
Cuando agregas la propiedad openapi a un elemento de navegación (como un anchor, tab o group) sin especificar ninguna página, Mintlify genera automáticamente páginas para todos los endpoints definidos en tu especificación de OpenAPI.Para controlar qué endpoints aparecen, enumera explícitamente los endpoints deseados en un arreglo pages.
Para obtener más información sobre cómo hacer referencia a endpoints de OpenAPI en tu documentación, consulta la sección Configuración de OpenAPI. 
{
  "navigation": {
    "groups": [
      {
        "group": "Referencia de la API",
        "openapi": "/path/to/openapi-v1.json",
        "pages": [
          "descripción-general",
          "autenticación",
          "GET /users",
          "POST /users",
          {
            "group": "Productos",
            "openapi": "/path/to/openapi-v2.json",
            "pages": [
              "GET /products",
              "POST /products"
            ]
          }
        ]
      }
    ]
  }
}

​
Versiones

Divide tu navigation en diferentes versiones. Puedes seleccionar la versión desde un menú desplegable. Gráfico decorativo de un selector de versión. En el objeto navigation, versions es un array en el que cada entrada es un objeto que requiere un campo version y puede contener cualquier otro campo de navegación. 
{
  "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 navegación en diferentes idiomas. Los idiomas se pueden seleccionar desde un menú desplegable. Gráfico decorativo de un selector de idioma. En el objeto navigation, languages es un array donde cada entrada es un objeto que requiere un campo language y puede contener cualquier otro campo de navegación, incluidas configuraciones de banners específicas por idioma. Actualmente ofrecemos compatibilidad con los siguientes idiomas para la localización:
https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/ar.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=1d2b397bae3100c21089394967d5b6ed

Árabe (ar)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/cs.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=bcdcc7105aa807745d5a6e5995143b2d

Checo (cs)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/cn.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=99c00d04cf00d95d817243e86caee8ff

Chino (cn)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/cn.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=99c00d04cf00d95d817243e86caee8ff

Chino (zh-Hant)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/nl.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=ce46a9dda6d7392480f7ce4075e188df

Neerlandés (nl)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/en.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=b151ddb015628c19c00932810eab6cf5

Inglés (en)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/fr.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=0c08d85a6310af694c8e3d9de22dd77b

Francés (fr)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/de.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=f91331daba7fb3a197871d65ed38d135

Alemán (de)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/he.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=0f8fd0220d50d6dc29334681881436b8

Hebreo (he)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/hi.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=da4adc3507f2e358bcf52ce3406a87c4

Hindi (hi)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/id.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=f9d62873a61be465cd00517a1f3d3b77

Indonesio (id)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/it.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=6bc84439d7708f6e749bdc5cb8e53076

Italiano (it)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/jp.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=bf989858bb84d8e530256f1dfd79e172

Japonés (jp)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/ko.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=6ac5841deffd49b6f0e4f3dd344483ce

Coreano (ko)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/lv.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=2156d30e10212a2849d9402ea28b9aae

Letón (lv)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/no.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=daffdef00e4c2f4ce37bddfc1c0b1923

Noruego (no)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/pl.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=381ea98b6166475b88dc7d54d19b4456

Polaco (pl)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/pt-br.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=b7184110f9c80dd41a7e464eba0a3a8e

Portugués (pt-BR)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/ro.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=551adefac53399decf0fc342be780387

Rumano (ro)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/ru.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=6613ba259835e368403641ae3fea58ea

Ruso (ru)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/es.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=4ea8c27c82f881483942a652a6e948c1

Español (es)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/sv.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=a8067feb17d3b6a9503762fadf5b5b9c

Sueco (sv)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/tr.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=68b9d91330437a1783d0873e91d145e3

Turco (tr)

https://mintcdn.com/anotherhorizon/nGGkQ8HPtMLIJ_OO/images/navigation/languages/ua.png?fit=max&auto=format&n=nGGkQ8HPtMLIJ_OO&q=85&s=a8c8c36fe3ac2153f78cb6bfe9a002a0

Ucraniano (ua)

https://mintcdn.com/anotherhorizon/KtT4EXjd_91dkOA7/images/navigation/languages/uz.png?fit=max&auto=format&n=KtT4EXjd_91dkOA7&q=85&s=87098bb08e3f7a6fae5709204315d91c

Uzbeko (uz)

https://mintcdn.com/anotherhorizon/KtT4EXjd_91dkOA7/images/navigation/languages/vi.png?fit=max&auto=format&n=KtT4EXjd_91dkOA7&q=85&s=d1102f0e3eab69b9d759b2384dd57b1f

Vietnamita (vi)

{
  "navigation": {
    "languages": [
      {
        "language": "en",
        "banner": {
          "content": "🚀 Version 2.0 is now live! See our [changelog](/en/changelog) for details.",
          "dismissible": true
        },
        "groups": [
          {
            "group": "Getting started",
            "pages": ["en/overview", "en/quickstart", "en/development"]
          }
        ]
      },
      {
        "language": "es",
        "banner": {
          "content": "🚀 ¡La versión 2.0 ya está disponible! Consulta nuestro [registro de cambios](/es/changelog).",
          "dismissible": true
        },
        "groups": [
          {
            "group": "Primeros pasos",
            "pages": ["es/overview", "es/quickstart", "es/development"]
          }
        ]
      }
    ]
  }
}
Para traducciones automáticas, ponte en contacto con nuestro equipo de ventas para explorar soluciones.

​
Anidación

Los elementos de navegación se pueden anidar entre sí para crear jerarquías complejas. Debes tener un elemento de navegación principal en el nivel raíz, como pestañas, grupos o un menú desplegable. Puedes anidar otros tipos de elementos de navegación dentro de tu patrón de navegación principal. Cada elemento de navegación puede contener un solo tipo de elemento hijo en cada nivel de tu jerarquía de navegación. Por ejemplo, una pestaña puede contener pestañas que contienen grupos, pero una pestaña no puede contener tanto pestañas como grupos en el mismo nivel. 
{
  "navigation": {
    "tabs": [
      {
        "tab": "Documentation",
        "anchors": [
          {
            "anchor": "Guides",
            "icon": "book-open",
            "pages": ["quickstart", "tutorial"]
          },
          {
            "anchor": "API Reference",
            "icon": "code",
            "pages": ["api/overview", "api/endpoints"]
          }
        ]
      },
      {
        "tab": "Resources",
        "groups": [
          {
            "group": "Help",
            "pages": ["support", "faq"]
          }
        ]
      }
    ]
  }
}

{
  "navigation": {
    "anchors": [
      {
        "anchor": "Documentation",
        "icon": "book-open",
        "tabs": [
          {
            "tab": "Guides",
            "pages": ["quickstart", "tutorial"]
          },
          {
            "tab": "API",
            "pages": ["api/overview", "api/endpoints"]
          }
        ]
      },
      {
        "anchor": "Community",
        "icon": "users",
        "href": "https://community.example.com"
      }
    ]
  }
}

{
  "navigation": {
    "products": [
      {
        "product": "Platform",
        "icon": "server",
        "tabs": [
          {
            "tab": "Documentation",
            "groups": [
              {
                "group": "Getting started",
                "pages": ["platform/quickstart"]
              }
            ]
          },
          {
            "tab": "API Reference",
            "pages": ["platform/api"]
          }
        ]
      },
      {
        "product": "Mobile SDK",
        "icon": "mobile",
        "pages": ["mobile/overview"]
      }
    ]
  }
}

{
  "navigation": {
    "products": [
      {
        "product": "Platform",
        "icon": "cloud",
        "tabs": [
          {
            "tab": "Documentation",
            "menu": [
              {
                "item": "Getting Started",
                "icon": "rocket",
                "groups": [
                  {
                    "group": "Setup",
                    "pages": ["platform/install", "platform/config"]
                  },
                  {
                    "group": "Core Concepts",
                    "pages": ["platform/concepts/auth", "platform/concepts/data"]
                  }
                ]
              },
              {
                "item": "Guides",
                "icon": "book",
                "pages": ["platform/guides/deployment", "platform/guides/scaling"]
              }
            ]
          },
          {
            "tab": "API Reference",
            "groups": [
              {
                "group": "REST API",
                "pages": ["platform/api/users", "platform/api/projects"]
              },
              {
                "group": "GraphQL",
                "pages": ["platform/api/graphql/queries", "platform/api/graphql/mutations"]
              }
            ]
          }
        ]
      },
      {
        "product": "Analytics",
        "icon": "chart-bar",
        "tabs": [
          {
            "tab": "Documentation",
            "groups": [
              {
                "group": "Getting Started",
                "pages": ["analytics/quickstart", "analytics/setup"]
              }
            ]
          },
          {
            "tab": "API",
            "pages": ["analytics/api/events", "analytics/api/reports"]
          }
        ]
      }
    ]
  }
}

{
  "navigation": {
    "versions": [
      {
        "version": "v2.0",
        "tabs": [
          {
            "tab": "Documentation",
            "groups": [
              {
                "group": "Getting Started",
                "pages": ["v2/quickstart", "v2/migration-from-v1"]
              },
              {
                "group": "Features",
                "pages": ["v2/features/auth", "v2/features/api"]
              }
            ]
          },
          {
            "tab": "API Reference",
            "pages": ["v2/api/overview", "v2/api/endpoints"]
          }
        ]
      },
      {
        "version": "v1.0",
        "tabs": [
          {
            "tab": "Documentation",
            "groups": [
              {
                "group": "Getting Started",
                "pages": ["v1/quickstart"]
              }
            ]
          },
          {
            "tab": "API Reference",
            "pages": ["v1/api/overview"]
          }
        ]
      }
    ]
  }
}
Las migas de pan muestran la ruta completa de navegación en la parte superior de las páginas. Algunos temas las traen habilitadas de forma predeterminada y otros no. Puedes controlar si las migas de pan están habilitadas en tu sitio usando la propiedad styling en tu docs.json. 
"styling": {
  "eyebrows": "breadcrumbs"
}

"styling": {
  "eyebrows": "section"
}

​
Configuración de la interacción

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

​
Habilitar la navegación automática para grupos

Cuando un usuario expande un grupo de navigation, algunos temas navegarán automáticamente a la primera página del grupo. Puedes anular el comportamiento predeterminado del tema usando la opción drilldown.
  • Configúralo en true para forzar la navegación automática a la primera página cuando se selecciona un grupo de navigation.
  • Configúralo en false para evitar la navegación y solo expandir o contraer el grupo al seleccionarlo.
  • 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
}

"interaction": {
  "drilldown": false // No navegar nunca, solo expandir o contraer el grupo
}