mintlify__docs/es/ai/contextual-menu.mdx

---
title: "Menú contextual"
description: "Agrega a tu documentación un menú contextual con integraciones de IA en un clic para ChatGPT, Claude, Perplexity, Google AI Studio y herramientas MCP."
keywords: ["Herramientas de IA", "ChatGPT", "Claude", "Perplexity", "MCP", "Grok", "cursor", "vscode", "vs code", "Google AI Studio", "aistudio", "Devin", "Windsurf", "Devin Desktop", "pdf", "copiar página", "botón de copiar", "copiar markdown", "copiar como markdown", "ver como markdown", "menú contextual", "menú de página", "menú de IA", "acciones de IA", "abrir en", "descargar pdf", "exportar pdf", "preguntar a la IA", "openapi", "descargar spec"]
---

import { PreviewButton } from "/snippets/previewbutton.jsx"
import IconsRequired from "/snippets/es/icons-required.mdx";

El menú contextual ofrece acceso rápido a contenido optimizado con IA e integraciones directas con herramientas de IA populares. Cuando los usuarios seleccionan el menú contextual en cualquier página, pueden copiar contenido como contexto para herramientas de IA o abrir conversaciones en ChatGPT, Claude, Perplexity, Google AI Studio, Grok, Devin, Devin Desktop o una herramienta personalizada de su elección, con su documentación ya cargada como contexto.

<Tip>
  Combina el menú contextual con tu archivo [`skill.md`](/es/ai/skillmd) alojado y tu [servidor MCP](/es/ai/model-context-protocol) para que los usuarios puedan instalar todas las capacidades de tu producto en sus herramientas de IA, no solo la página que están leyendo.
</Tip>

<div id="menu-options">
  ## Opciones del menú
</div>

El menú contextual incluye varias opciones preconfiguradas que puedes habilitar agregando su identificador a tu configuración.

| Opción                                             | Identificador | Descripción                                                                           |
| :------------------------------------------------- | :------------ | :------------------------------------------------------------------------------------ |
| **Copiar página**                                  | `copy`        | Copia la página actual como Markdown para pegarla como contexto en herramientas de IA |
| **Ver como Markdown**                              | `view`        | Abre la página actual como Markdown                                                   |
| **Preguntar a assistant**                          | `assistant`   | Abre el [assistant](/es/assistant/index) con la página actual como contexto                 |
| **Descargar PDF**                                  | `download-pdf` | Descarga la página actual como PDF. Disponible en los [planes Enterprise](https://mintlify.com/pricing). |
| **Abrir en ChatGPT**                               | `chatgpt`     | Crea una conversación en ChatGPT con la página actual como contexto                   |
| **Abrir en Claude**                                | `claude`      | Crea una conversación en Claude con la página actual como contexto                    |
| **Abrir en Perplexity**                            | `perplexity`  | Crea una conversación en Perplexity con la página actual como contexto                |
| **Abrir en Grok**                                  | `grok`        | Crea una conversación en Grok con la página actual como contexto                      |
| **Abrir en Google AI Studio**                      | `aistudio`    | Crea una conversación en Google AI Studio con la página actual como contexto          |
| **Abrir en Devin**                                 | `devin`       | Crea una sesión de Devin con la página actual como contexto                           |
| **Abrir en Devin Desktop**                         | `devin-desktop` | Abre Devin Desktop con la página actual como contexto. Requiere instalar Devin Desktop. |
| **Copiar URL del servidor MCP**                    | `mcp`         | Copia la URL de tu servidor MCP al portapapeles                                       |
| **Copiar comando de instalación del servidor MCP** | `add-mcp`     | Copia el comando `npx add-mcp` para instalar el servidor MCP                          |
| **Conectar con Cursor**                            | `cursor`      | Instala tu servidor MCP alojado en Cursor                                             |
| **Conectar con VS Code**                           | `vscode`      | Instala tu servidor MCP alojado en VS Code                                            |
| **Conectar con Devin**                             | `devin-mcp`   | Instala tu servidor MCP alojado en Devin                                              |
| **Descargar especificación de API**                | `downloadApiSpec` | Descarga la especificación OpenAPI de tu despliegue. Si hay varias especificaciones configuradas, las descarga como un archivo zip. Solo aparece en páginas de referencia de API. |
| **Opciones personalizadas**                        | Object        | Agrega opciones personalizadas al menú contextual                                     |

<Frame>
  <img src="/images/contextual-menu/contextual-menu.png" alt="El menú contextual expandido que muestra los elementos del menú Copiar página, Ver como Markdown, Abrir en ChatGPT y Abrir en Claude." />
</Frame>

<Note>
  La opción `downloadApiSpec` solo aparece en páginas de referencia de API (páginas cuyo frontmatter declara `api`, `openapi` o `asyncapi`). En despliegues con autenticación o autenticación de usuario habilitada, solo los lectores autenticados pueden descargar la especificación.
</Note>

<div id="enabling-the-contextual-menu">
  ## Activar el menú contextual
</div>

Añade el campo `contextual` a tu archivo `docs.json` y especifica qué opciones quieres incluir. Las opciones aparecen en el menú en el orden en el que las enumeras.

```json
{
 "contextual": {
   "options": [
     "copy",
     "view",
     "assistant",
     "download-pdf",
     "chatgpt",
     "claude",
     "perplexity",
      "grok",
       "aistudio",
       "devin",
       "devin-desktop",
        "mcp",
      "cursor",
      "vscode",
      "devin-mcp",
      "downloadApiSpec"
    ]
 }
}
```

<div id="display-location">
  ## Ubicación de visualización
</div>

De forma predeterminada, el menú contextual aparece en el encabezado de la página. Puedes configurarlo para que se muestre en la barra lateral de la tabla de contenidos mediante la opción `display`.

```json
{
  "contextual": {
    "options": ["copy", "view", "chatgpt", "claude"],
    "display": "toc"
  }
}
```

| Valor | Descripción |
|:------|:------------|
| `header` | Muestra las opciones en el menú contextual de la parte superior de la página (predeterminado) |
| `toc` | Muestra las opciones en la barra lateral de la tabla de contenidos |

<div id="adding-custom-options">
  ## Agregar opciones personalizadas
</div>

Crea opciones personalizadas en el menú contextual agregando un objeto al arreglo `options`. Cada opción personalizada requiere estas propiedades:

<ResponseField name="title" type="string" required>
  El título de la opción.
</ResponseField>

<ResponseField name="description" type="string" required>
  La descripción de la opción. Se muestra debajo del título cuando el menú contextual se expande.
</ResponseField>

<IconsRequired />

<ResponseField name="href" type="string | object" required>
  El href de la opción. Usa una cadena para enlaces simples o un objeto para enlaces dinámicos con parámetros de búsqueda.

  <Expandable title="href object">
    <ResponseField name="base" type="string" required>
      La URL base de la opción.
    </ResponseField>

    <ResponseField name="query" type="object" required>
      Los parámetros de búsqueda de la opción.

      <Expandable title="query object">
        <ResponseField name="key" type="string" required>
          La key del parámetro de búsqueda.
        </ResponseField>

        <ResponseField name="value" type="string" required>
          El value del parámetro de búsqueda. Mintlify reemplaza los siguientes marcadores de posición por los valores correspondientes:

          * Usa `$page` para insertar el contenido de la página actual en Markdown.
          * Usa `$path` para insertar la ruta de la página actual.
          * Usa `$mcp` para insertar la URL del servidor MCP alojado.
        </ResponseField>
      </Expandable>
    </ResponseField>
  </Expandable>
</ResponseField>

Ejemplo de opción personalizada:

```json {9-14} wrap
{
    "contextual": {
        "options": [
            "copy",
            "view",
            "chatgpt",
            "claude",
            "perplexity",
            {
                "title": "Solicitar una funcionalidad",
                "description": "Únete a la discusión en GitHub para solicitar una nueva funcionalidad",
                "icon": "plus",
                "href": "https://github.com/orgs/mintlify/discussions/categories/feature-requests"
            }
        ]
    }
}
```

<div id="override-on-individual-pages">
  ## Sobrescribir en páginas individuales
</div>

Sobrescribe el menú contextual global en una página específica añadiendo un campo `contextual` al frontmatter de la página. Úsalo para mostrar acciones específicas de la página, como `download-pdf` en una página de términos de servicio, u ocultar el menú por completo en una landing page.

El objeto `contextual` a nivel de página reemplaza al global en esa página. Omite el campo para heredar `docs.json`, o define `options: []` para desactivar el menú contextual en esa página.

```mdx
---
title: "Términos de servicio"
contextual:
  options:
    - copy
    - download-pdf
  display: header
---
```

Se aplican los mismos campos y reglas de validación que en `docs.json`, incluidas las [opciones personalizadas](#adding-custom-options) y la configuración `display`. Si la sobrescritura de página no es válida, Mintlify utiliza la configuración global de `contextual`.

<div id="custom-option-examples">
  ### Ejemplos de opciones personalizadas
</div>

<AccordionGroup>
  <Accordion title="Enlace simple">
    ```json
    {
      "title": "Solicitar una función",
      "description": "Únete a la conversación en GitHub",
      "icon": "plus",
      "href": "https://github.com/orgs/mintlify/discussions/categories/feature-requests"
    }
    ```
  </Accordion>

  <Accordion title="Enlace dinámico con contenido de la página">
    ```json
    {
      "title": "Compartir en X",
      "description": "Comparte esta página en X",
      "icon": "x",
      "href": {
        "base": "https://x.com/intent/tweet",
        "query": [
          {
          "key": "text",
          "value": "Consulta esta documentación: $page"
          }
        ]
      }
    }
    ```
  </Accordion>
</AccordionGroup>