mintlify__docs/es/ai/contextual-menu.mdx

---
title: "Menú contextual"
description: "Agrega un menú contextual a tu documentación con integraciones de IA en un clic para ChatGPT, Claude, Perplexity y más."
keywords: ["Herramientas de IA", "ChatGPT", "Claude", "Perplexity", "MCP", "Grok", "Cursor", "vscode", "vs code", "Google AI Studio", "aistudio", "Devin", "Windsurf", "pdf"]
---

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, Windsurf 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 Windsurf**                              | `windsurf`    | Abre Windsurf Cascade con la página actual como contexto                              |
| **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. |
| **Descargar PDF**                                  | `download-pdf` | Descarga la página actual como un PDF                                                |
| **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.

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

<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="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>