mintlify__docs/es/editor/configurations.mdx

---
title: "Configuraciones"
description: "Edita los metadatos de las páginas, los elementos de navegación y la configuración multimedia usando las hojas de configuración visuales en la barra lateral del editor web de Mintlify."
keywords: ["editor", "configurations", "settings"]
boost: 3
---

Configura la marca, la apariencia y las funcionalidades de tu sitio de documentación desde el panel **Configurations** en el editor web.

<Frame>
  <img src="/images/editor/configurations-light.png" alt="Opciones de Configurations en la barra lateral en modo claro." className="block dark:hidden" />

  <img src="/images/editor/configurations-dark.png" alt="Opciones de Configurations en la barra lateral en modo oscuro." className="hidden dark:block" />
</Frame>

<div id="brand-your-site">
  ## Define la marca de tu sitio
</div>

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

* **Título de la documentación**: El nombre de tu documentación. Aparece en las pestañas del navegador y en los resultados de búsqueda.
* **Descripción**: Breve resumen de tu documentación. Se utiliza para SEO y los metadatos del sitio.
* **Favicon**: Pequeño icono que aparece en las pestañas del navegador. Carga archivos ICO, PNG, GIF o JPG.
* **Tema**: Elige un [tema](/es/customize/themes) para la apariencia general de tu documentación.

<div id="customize-colors-and-appearance">
  ## Personaliza los colores y la apariencia
</div>

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

* **Color primario**: El color de acento principal que se usa en todo tu sitio para enlaces, botones y elementos destacados.
* **Color del modo claro**: Variación del color de acento para el modo claro. La forma en que se aplica depende de cada tema.
* **Color del modo oscuro**: Variación del color de acento para el modo oscuro. La forma en que se aplica depende de cada tema.
* **Logo**: El logo de tu marca. Sube archivos PNG o JPG. Puedes establecer logos distintos para los modos claro y oscuro. Para usar un logo SVG, añade el archivo a tu repositorio a través de Git y haz referencia a su ruta en tu configuración de docs.json.
* **Enlace del logo**: Adónde van los usuarios cuando hacen clic en tu logo. Normalmente es tu página de inicio o tu sitio de marketing.
* **Colores de fondo**: Configura colores de fondo personalizados por separado para los modos claro y oscuro.
* **Imagen de fondo**: Añade una imagen de fondo a tu sitio. Sube archivos PNG, GIF o JPG.
* **Decoración de fondo**: Aplica estilos visuales a tu imagen de fondo.
* **Selector de tema**: Muestra u oculta el interruptor de modo claro/oscuro para los usuarios.
* **Tema predeterminado**: Define si tu sitio se carga en modo claro u oscuro de forma predeterminada.

<div id="set-custom-fonts">
  ## Configurar fuentes personalizadas
</div>

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

* **Fuente predeterminada**: La familia tipográfica y el peso base para todo el texto. Proporciona una URL de origen y el formato (WOFF o WOFF2).
* **Fuente de encabezados**: Familia tipográfica y peso específicamente para encabezados (h1, h2, etc.). Se configura por separado del cuerpo de texto.
* **Fuente del cuerpo**: Familia tipográfica y peso para el cuerpo de texto y los párrafos.

Para cada fuente, especifica el nombre de la familia, el peso, la URL de origen (como Google Fonts) y el formato.

<div id="configure-header">
  ## Configurar el encabezado
</div>

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

* **Botón de la barra de navegación**: Agrega un botón principal de llamada a la acción en tu encabezado. Configura el tipo de botón, el label y la URL de destino.
* **Enlaces de la barra de navegación**: Agrega enlaces de navegación adicionales en tu encabezado. Cada enlace incluye texto y una URL.

<div id="configure-footer">
  ## Configurar el footer
</div>

Agrega enlaces y perfiles de redes sociales al footer de tu sitio.

* **Enlaces sociales**: Agrega tus perfiles en plataformas como GitHub, X (Twitter), LinkedIn, Discord, YouTube, Slack y más.
* **Columnas del footer**: Organiza los enlaces del footer en columnas con títulos personalizados y grupos de enlaces.

<div id="enhance-content">
  ## Mejorar el contenido
</div>

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

* **Fondo de miniatura**: Configura una imagen de fondo personalizada para las miniaturas de página y las vistas previas en redes sociales.
* **Apariencia de la miniatura**: Controla cómo se muestran las miniaturas.
* **Fuente de la miniatura**: Configura una fuente personalizada para el texto en las miniaturas.
* **Etiqueta de página**: Añade pequeñas etiquetas encima de los títulos de las páginas.
* **Tema del bloque de código**: Elige el tema de resaltado de sintaxis para los bloques de código.
* **Soporte para LaTeX**: Habilita el renderizado de notación matemática con LaTeX.

<div id="set-up-ai-chat-and-search">
  ## Configura el chat y la búsqueda con IA
</div>

Personaliza la experiencia de búsqueda.

* **Marcador de posición de búsqueda**: El texto que aparece en el campo de búsqueda antes de que los usuarios escriban. El valor predeterminado es «Buscar o preguntar…».

<div id="connect-integrations">
  ## Conectar integraciones
</div>

Conecta herramientas de terceros para Analytics, soporte y cumplimiento.

<div id="configure-api-specifications">
  ## Configurar especificaciones de la API
</div>

Agrega archivos de especificación [OpenAPI](/es/api-playground/openapi-setup) o [AsyncAPI](/es/api-playground/asyncapi-setup) para documentar endpoints.

* **Especificaciones de OpenAPI**: Sube un archivo de especificación de OpenAPI o ingresa una URL a un archivo externo de OpenAPI.
* **Especificaciones de AsyncAPI**: Sube un archivo de especificación de AsyncAPI o ingresa una URL a un archivo externo de AsyncAPI.
* **Visualización del área de pruebas**: Elige mostrar el área de pruebas interactiva de la API, el área de pruebas simple de la API o ninguna área de pruebas de la API.
* **Servidor proxy**: Activa o desactiva el servidor proxy para solicitudes a la API.

<div id="manage-redirects">
  ## Gestionar redirecciones
</div>

Usa la sección **Redirects** para agregar, editar, buscar y eliminar redirecciones sin tener que editar manualmente tu archivo `docs.json`. Las redirecciones envían a los usuarios desde URLs antiguas a otras nuevas, lo que resulta útil cuando renombras páginas o reestructuras tu documentación. Para obtener más información sobre el comportamiento de las redirecciones, consulta [Redirecciones](/es/create/redirects).

Cada redirección tiene los siguientes campos:

- **Source**: La ruta desde la que se redirige, como `/old-path`. Admite comodines.
- **Destination**: La ruta a la que se redirige, como `/new-path`.
- **Status**: El código de estado HTTP de la redirección.
  - `308`: Redirección permanente. Úsalo para contenido que se ha movido de manera permanente. Es el estado predeterminado.
  - `307`: Redirección temporal. Úsalo cuando el cambio sea temporal.

<Frame>
  <img
    src="/images/editor/redirects-light.png"
    alt="Menú de redirecciones en el editor."
    className="block dark:hidden"
  />
  <img
    src="/images/editor/redirects-dark.png"
    alt="Menú de redirecciones en el editor."
    className="hidden dark:block"
  />
</Frame>

Para agregar una redirección:
1. Haz clic en **Add redirect**.
2. Introduce el origen y el destino.
3. Haz clic en **Save**.

Para editar o eliminar una redirección existente:
1. Pasa el cursor por encima de la redirección.
2. Haz clic en el icono del lápiz para editarla o en el icono de la papelera para eliminarla.

<div id="add-analytics-and-integrations">
  ## Agrega analítica e integraciones
</div>

Conecta herramientas de analítica y servicios de terceros a tu documentación.

Realiza el seguimiento del comportamiento de los visitantes con:

* **Amplitude, Mixpanel, Heap**: Plataformas de analítica de producto
* **Google Analytics, Google Tag Manager**: Analítica web
* **PostHog, Plausible, Fathom**: Analítica centrada en la privacidad
* **Segment, Hightouch**: Plataformas de datos de clientes
* **Hotjar, LogRocket**: Reproducción de sesiones y mapas de calor
* **Microsoft Clarity**: Analítica del comportamiento de usuarios
* **Intercom**: Mensajería con clientes
* **Clearbit, Koala**: Identificación de visitantes

Integraciones adicionales:

* **Telemetry**: Activa o desactiva la telemetría de uso
* **Cookies**: Define pares personalizados de key y value de cookies