Configuraciones

Edita la marca, la apariencia, la navegación y las funcionalidades desde el panel Configurations del editor web, con sincronización en tiempo real.

Configura la marca, la apariencia y las funcionalidades de tu sitio de documentación desde el panel Configurations en el editor web. Los cambios se sincronizan en tiempo real con otros editores en la misma rama.

El panel está organizado en secciones que se corresponden con las propiedades de nivel superior de tu docs.json. Usa la tabla de contenido a la derecha para saltar entre secciones.

​

General

Define la identidad de tu sitio y cómo aparece para los visitantes.

• Name: El nombre de tu proyecto. Aparece en las pestañas del navegador y en los resultados de búsqueda.
• Description: Resumen breve del proyecto. Se usa para SEO y AEO.

​

Branding

Sube las marcas que identifican tu sitio.

• Logo: El logo de tu marca. Sube archivos PNG o JPG. Define versiones claras y oscuras separadas y una URL opcional de destino. Para usar un logo SVG, añade el archivo a tu repositorio y referencia su ruta en tu docs.json.
• Favicon: Pequeño icono que aparece en las pestañas del navegador. Sube archivos ICO, PNG, GIF o JPG. Define versiones claras y oscuras separadas si es necesario.

​

Styling

Controla la identidad visual y la paleta de colores de tu sitio.

• Theme: Elige un tema para la apariencia general del sitio.
• Primary color: El color de acento principal usado en enlaces, botones y elementos destacados.
• Light color: Color de acento usado en modo oscuro. La forma de aplicarlo depende del tema.
• Dark color: Color de acento usado en modo claro. La forma de aplicarlo depende del tema.
• Background color: Colores de fondo personalizados para los modos claro y oscuro.
• Icon library: Biblioteca de iconos usada en todas las propiedades de icono. Por defecto es fontawesome.
• Strict appearance: Bloquea el sitio en un único modo de apariencia y oculta el selector de tema.
• Default appearance: Si tu sitio carga en modo system, light o dark por defecto.
• Background decoration: Aplica un estilo visual (gradient, grid o windows) al fondo.
• Background image: Imagen de fondo opcional. Configura una sola imagen o versiones separadas para modo claro y oscuro.

​

Typography

Reemplaza las fuentes predeterminadas con la tipografía de tu marca.

• Font family: Cualquier familia de Google Fonts funciona directamente. Para una fuente autoalojada, proporciona la URL de origen y el formato (woff o woff2).
• Weight: Normalmente 400 para regular y 700 para negrita. Las fuentes variables admiten pesos precisos como 550.
• Heading font: Override opcional aplicado a todos los encabezados (h1–h6).
• Body font: Override opcional aplicado al cuerpo de texto y al resto de la página.

​

Navbar

Agrega elementos de navegación a la parte superior del sitio.

• Primary button: La llamada a la acción principal del encabezado. Configura el tipo, el label y la URL de destino.
• Navbar links: Enlaces de navegación adicionales del encabezado. Cada enlace incluye texto y una URL.

​

Footer

Agrega enlaces y redes sociales al footer de tu sitio.

• Social links: Perfiles en plataformas como GitHub, X, LinkedIn, Discord, YouTube y Slack.
• Footer columns: Activa columnas (hasta cuatro) con títulos personalizados para organizar los enlaces del footer.

​

Banner

Muestra un anuncio en la parte superior de cada página.

• Content: El texto del banner. Admite formato MDX básico como enlaces, negrita y cursiva. No se admiten componentes personalizados.
• Dismissible: Muestra un botón para cerrar el banner.
• Type: Estilo visual. info usa el color principal de la marca, warning usa un fondo ámbar y critical usa un fondo rojo. Por defecto es info.
• Color: Sobrescribe el color de fondo del banner con un hex personalizado. Define valores separados para claro y oscuro.

​

Thumbnail

Personaliza las miniaturas de página y las vistas previas en redes sociales.

• Background: Imagen de fondo personalizada para las miniaturas.
• Appearance: Renderiza las miniaturas en modo light o dark. Si no se define, se generan automáticamente a partir de los colores del tema.
• Font: Fuente personalizada para el texto de las miniaturas.

​

Content

Personaliza cómo se muestra el contenido en tu sitio.

• Code block theme: Sigue el modo claro/oscuro del sitio con system, usa siempre uno oscuro con dark, o elige un tema personalizado de Shiki.
• Custom code languages: Registra lenguajes adicionales para el resaltado de sintaxis.
• Page eyebrow: Muestra pequeñas etiquetas encima de los títulos de página. Elige section o breadcrumbs.
• Timestamps: Muestra la fecha de la última modificación en todas las páginas.
• LaTeX: Carga la hoja de estilos de LaTeX (KaTeX) para renderizar notación matemática.

​

Context menu

Configura las acciones rápidas del menú contextual de página.

• Options: Desplegable multi-selección con acciones como copy, view y abrir la página en chatgpt, claude, cursor y otros asistentes de IA.
• Display: Dónde mostrar las opciones. header (por defecto) las muestra en el menú contextual superior; toc las muestra en la barra lateral de la tabla de contenido.

​

Navigation

Ajusta el comportamiento de la navegación.

• Drilldown: Navega automáticamente a la primera página cuando un usuario hace clic en un grupo de navegación.

​

Search

Personaliza la experiencia de búsqueda y feedback.

• Search placeholder: Texto que aparece en el campo de búsqueda antes de escribir. Por defecto es Search or ask.
• Feedback: Muestra botones de pulgar arriba/abajo o un enlace “Suggest edits” en cada página.

​

API reference

Documenta los endpoints de tu API.

• OpenAPI specs: Añade archivos de especificación OpenAPI para generar páginas de referencia.
• AsyncAPI specs: Añade archivos de especificación AsyncAPI para generar páginas de referencia.
• MDX server: Endpoints personalizados del servidor MDX para el playground.
• Playground display: Muestra el playground interactivo, el playground simple o ninguno.
• Proxy server: Activa o desactiva el servidor proxy para las solicitudes de la API.
• mdx.schema: Renderiza la sección de schema en las páginas de referencia.

​

Redirects

Usa la sección Redirects para agregar, editar, buscar y eliminar redirecciones sin editar manualmente tu docs.json. Para más información, consulta Redirecciones.

Cada redirección tiene los siguientes campos:

• Source: Ruta desde la que se redirige, como /old-path. Admite comodines.
• Destination: Ruta a la que se redirige, como /new-path. Admite comodines.
• Status: Código de estado HTTP.
  • 308: Redirección permanente. Es el valor por defecto.
  • 307: Redirección temporal.

Para agregar una redirección:

1. Haz clic en Add redirect.
2. Ingresa el origen y el destino.
3. Haz clic en Save.

Para editar o eliminar una redirección, pasa el cursor por la fila y usa el icono de edición en línea o la X para eliminarla.

​

SEO

Configura metatags e indexación para motores de búsqueda.

• Metatags: Etiquetas <meta> personalizadas aplicadas en todo el sitio. Añade pares clave-valor como og:image o twitter:card.
• Indexing: Elige si indexar las páginas ocultas.

​

Analytics

Conecta plataformas de analítica para hacer seguimiento del comportamiento de los visitantes. Los proveedores compatibles incluyen Amplitude, Mixpanel, Heap, Google Analytics, Google Tag Manager, PostHog, Plausible, Fathom, Segment, Hightouch, Hotjar, LogRocket, Microsoft Clarity, Intercom, Clearbit y más.

Cada entrada se muestra como una fila en línea. Usa el icono X para eliminar una integración.

​

404 page

Personaliza la experiencia cuando un usuario llega a una página inexistente.

• Redirect to home: Cuando está activado, las páginas faltantes redirigen al inicio. Cuando está desactivado, se muestra una página 404 y puedes personalizar su título y descripción.
• Title: Encabezado mostrado en la página 404.
• Description: Subtítulo mostrado en la página 404.

​

Variables

Define variables personalizadas que se pueden reutilizar en todo el contenido. Cada variable es un par clave-valor. Usa el icono X para eliminar una variable.