> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.manicule.dev/es/llms.txt
> Use this file to discover all available pages before exploring further.
> For every page in one file, fetch https://mintlify.manicule.dev/es/llms-full.txt (large).
> To search and read these docs as tools, connect the MCP server at https://mintlify.manicule.dev/api/mcp.
> Every agent surface: https://mintlify.manicule.dev/.well-known/llms-manifest.json

# Agregar contenido multimedia (/es/editor/media)

<!-- agent-signals: reading_time_min: 3 · est_tokens: 1043 · updated: 2026-07-31 -->
Related: [Cómo usar el editor](/es/editor/tutorial.md), [Conceptos básicos de Git para el editor](/es/editor/git-essentials.md), [Crear y editar páginas](/es/editor/pages.md), [Organizar la navegación](/es/editor/navigation.md), [Vista previa en vivo](/es/editor/live-preview.md), [Branches y publicación](/es/editor/branching-and-publishing.md)

> Sube, gestiona e inserta imágenes y otros recursos multimedia en tus páginas de documentación usando el gestor de archivos integrado del editor web de Mintlify.

<div id="supported-file-types">
  ## Tipos de archivo admitidos
</div>

* **Imágenes**: PNG, JPG, JPEG, GIF, WebP (máx. 20 MB)
* **Vídeos**: MP4, WebM (máx. 20 MB)
* **Fuentes**: TrueType (TTF), WOFF, WOFF2
* **Otros**: PDF, ICO (favicons)

<div id="add-media-to-a-page">
  ## Agregar contenido multimedia a una página
</div>

<div id="drag-and-drop">
  ### Arrastrar y soltar
</div>

Arrastra y suelta contenido multimedia desde tu computadora o desde el gestor de recursos sobre una página. En modo visual, la imagen o el video se insertan en línea. En Modo Markdown, el editor inserta la ruta en la posición de tu cursor. Las imágenes se guardan en la raíz de tu carpeta `images/`, y los videos se guardan en la raíz de tu carpeta `videos/`.

<div id="slash-command">
  ### Comando slash
</div>

Escribe <kbd>/image</kbd> para abrir el menú de imágenes o <kbd>/video</kbd> para abrir el menú de vídeos. Sube contenido multimedia nuevo o selecciona entre los archivos existentes.

<div id="embed">
  ### Incrustar
</div>

Escribe <kbd>/embed</kbd> y pega una URL de YouTube, Loom o Vimeo. El editor detecta el proveedor y genera el iframe automáticamente. Al buscar en el menú slash, los términos `youtube`, `yt`, `loom` y `vimeo` también muestran el comando **Embed**.

Para otras incrustaciones, escribe <kbd>/embed</kbd> y activa **Inserción manual** para escribir HTML personalizado.

<div id="upload-files">
  ### Subir archivos
</div>

Usa el explorador de archivos en la barra lateral para subir o buscar archivos. Arrastra y suelta archivos en una carpeta para organizar recursos multimedia.

<Frame>
  <img src="/_assets/41068cf4ce81f10653073efcecbb63e8ae1e07b68099356e4dc02c4f6e9d9a9a" alt="Explorador de archivos abierto en el menú de la barra lateral del editor." className="block dark:hidden" width="790" height="816" />

  <img src="/_assets/b362613c14522f84ef5d95f9ab37de72cb32c288e9a4bd21d150765cabb2cd94" alt="Explorador de archivos abierto en el menú de la barra lateral del editor." className="hidden dark:block" width="792" height="818" />
</Frame>

<div id="format-images">
  ## Formatear imágenes
</div>

Después de insertar una imagen en el modo visual, pasa el cursor por encima para mostrar una barra de herramientas con opciones de formato.

* **Vista previa en modo claro/oscuro**: Cambia entre el modo claro y oscuro para ver cómo se ve la imagen en cada tema.
* **Alineación**: Establece la alineación de la imagen como izquierda, centrada, derecha o a todo el ancho.
* **Frame**: Envuelve la imagen en un componente `<Frame>` para añadir un borde y un fondo.
* **Configuración**: Reemplaza la imagen o actualiza su texto alternativo.

<div id="manage-assets">
  ## Administra los recursos
</div>

<div id="organize-with-folders">
  ### Organiza con carpetas
</div>

Haz clic en el botón **+** del explorador de archivos para crear una nueva carpeta. Arrastra y suelta archivos y carpetas en el árbol de archivos para reordenarlos.

<div id="rename-and-edit-assets">
  ### Renombrar y editar recursos
</div>

Pasa el cursor sobre un recurso y haz clic en el botón **...** para cambiar el nombre del archivo o actualizar su texto alternativo (alt).

<div id="delete-assets">
  ### Eliminar recursos
</div>

Pasa el cursor sobre un recurso y haz clic en el botón <Icon icon="trash" /> para eliminarlo.

<div id="best-practices">
  ## Mejores prácticas
</div>

* **Usa nombres descriptivos**: Pon nombres claros a los archivos, como `api-dashboard-light.png` en lugar de `img1.png`.
* **Agrega texto alternativo (alt text)**: Proporciona texto alternativo descriptivo para mejorar la accesibilidad y el SEO.
* **Organiza con carpetas**: Agrupa los recursos relacionados, como variantes de modo claro y oscuro o recursos para un área de funcionalidad específica.
* **Usa formatos apropiados**: PNG para gráficos con transparencia, JPG para fotos, SVG para iconos y logotipos (no puedes subir archivos SVG a través del editor, pero puedes agregarlos a tu repositorio mediante Git).