Contextual menu
Add a contextual menu to your docs with one-click AI integrations for ChatGPT, Claude, Perplexity, Google AI Studio, Devin, Devin Desktop, and MCP tools.
Menu options
Section titled “Menu options”The contextual menu includes several pre-built options that you can enable by adding their identifier to your configuration.
| Option | Identifier | Description |
|---|---|---|
| Copy page | copy |
Copies the current page as Markdown for pasting as context into AI tools |
| View as Markdown | view |
Opens the current page as Markdown |
| Ask assistant | assistant |
Opens the assistant with the current page as context |
| Download PDF | download-pdf |
Downloads the current page as a PDF. Available on Enterprise plans. |
| Open in ChatGPT | chatgpt |
Creates a ChatGPT conversation with the current page as context |
| Open in Claude | claude |
Creates a Claude conversation with the current page as context |
| Open in Perplexity | perplexity |
Creates a Perplexity conversation with the current page as context |
| Open in Grok | grok |
Creates a Grok conversation with the current page as context |
| Open in Google AI Studio | aistudio |
Creates a Google AI Studio conversation with the current page as context |
| Open in Devin | devin |
Creates a Devin session with the current page as context |
| Open in Devin Desktop | devin-desktop |
Opens Devin Desktop with the current page as context. Requires installing Devin Desktop. |
| Copy MCP server URL | mcp |
Copies your MCP server URL to the clipboard |
| Copy MCP install command | add-mcp |
Copies the npx add-mcp command to install the MCP server |
| Connect to Cursor | cursor |
Installs your hosted MCP server in Cursor |
| Connect to VS Code | vscode |
Installs your hosted MCP server in VS Code |
| Connect to Devin | devin-mcp |
Installs your hosted MCP server in Devin |
| Download API spec | download-spec |
Downloads your project's OpenAPI spec. If there are multiple specs, downloads them as a zip archive. Only appears on API reference pages. |
| Custom options | Object | Add custom options to the contextual menu |
Enable the contextual menu
Section titled “Enable the contextual menu”Add the contextual field to your docs.json file and specify which options you want to include. Options appear in the menu in the order you list them.
{
"contextual": {
"options": [
"copy",
"view",
"assistant",
"chatgpt",
"claude",
"perplexity",
"grok",
"aistudio",
"devin",
"devin-desktop",
"mcp",
"cursor",
"vscode",
"devin-mcp",
"download-spec",
"download-pdf"
]
}
}Display location
Section titled “Display location”By default, the contextual menu appears in the page header. You can configure it to display in the table of contents sidebar instead using the display option.
{
"contextual": {
"options": ["copy", "view", "chatgpt", "claude"],
"display": "toc"
}
}| Value | Description |
|---|---|
header |
Displays options in the top-of-page context menu (default) |
toc |
Displays options in the table of contents sidebar |
Add custom options
Section titled “Add custom options”Create custom options in the contextual menu by adding an object to the options array. Each custom option requires these properties:
-
title(string, required) — The title of the option. -
description(string, required) — The description of the option. Displayed beneath the title when the contextual menu expands.
icon(string) — The icon to display.
Options:
- Font Awesome icon name, if you have the
icons.libraryproperty set tofontawesomein yourdocs.json - Lucide icon name, if you have the
icons.libraryproperty set tolucidein yourdocs.json - Tabler icon name, if you have the
icons.libraryproperty set totablerin yourdocs.json - A single emoji (for example,
💡or🚀)
src(string) — Path or URL to an image to use as the icon. Usesrcinstead oficonwhen you want to use a custom image rather than an icon from a library.
Options:
- Path to an image file in your project (for example,
/images/my-icon.svg) - URL to an externally hosted image (for example,
https://example.com/icon.png)
iconType(string) — The Font Awesome icon style. Only used with Font Awesome icons.
Options: regular, solid, light, thin, sharp-solid, duotone, brands.
href(string | object, required) — The href of the option. Use a string for simple links or an object for dynamic links with query parameters.
href object
base(string, required) — The base URL for the option.query(object[]) — An array of query parameter objects to append to the base URL.
key(string, required) — The query parameter key.value(string, required) — The query parameter value. Mintlify replaces the following placeholders with the corresponding values:Use$pageto insert the current page content in Markdown.Use$pathto insert the current page path.Use$mcpto insert the hosted MCP server URL.
Example custom option:
{ "contextual": { "options": [ "copy", "view", "chatgpt", "claude", "perplexity", { "title": "Request a feature", "description": "Join the discussion on GitHub to request a new feature", "icon": "plus", "href": "https://github.com/orgs/mintlify/discussions/categories/feature-requests" } ] }}Override on individual pages
Section titled “Override on individual pages”To override the global contextual menu on a specific page, add the contextual field to the page's frontmatter. Override the global contextual menu to surface page-specific actions like download-pdf on a terms of service page, or to hide the menu entirely on a landing page.
The page-level contextual object replaces the global one for that page. Omit the field to inherit docs.json, or set options: [] to disable the contextual menu on that page.
---
title: "Terms of Service"
contextual:
options:
- copy
- download-pdf
display: header
---The same fields and validation rules apply as in docs.json, including custom options and the display setting. If a page override is invalid, Mintlify falls back to the global contextual configuration.
Custom option examples
Section titled “Custom option examples”Simple link
{
"title": "Request a feature",
"description": "Join the discussion on GitHub",
"icon": "plus",
"href": "https://github.com/orgs/mintlify/discussions/categories/feature-requests"
}Dynamic link with page content
{
"title": "Share on X",
"description": "Share this page on X",
"icon": "x",
"href": {
"base": "https://x.com/intent/tweet",
"query": [
{
"key": "text",
"value": "Check out this documentation: $page"
}
]
}
}