mintlify__docs/es/editor/pages.mdx

---
title: "Crear y editar páginas"
description: "Crea, edita y organiza páginas de documentación en el editor web."
keywords: ["editor","contenido","páginas","archivos"]
---

<div id="navigate-files">
  ## Navegar por archivos
</div>

Explora las páginas de tu documentación en la Tab **Navigation** del panel izquierdo.

* Haz clic en los elementos de navegación para expandirlos o contraerlos.
* Haz clic en las páginas para abrirlas en el editor.
* Haz clic en el icono de búsqueda o pulsa <kbd>Cmd</kbd> + <kbd>P</kbd> (macOS) o <kbd>Ctrl</kbd> + <kbd>P</kbd> (Windows) para buscar archivos por nombre de archivo. La búsqueda solo coincide con nombres de archivo exactos, así que usa guiones entre palabras (por ejemplo, `get-agent-job` en lugar de `get agent job`).

<div id="create-new-pages">
  ## Crear páginas nuevas
</div>

1. Haz clic en el botón **+** del elemento de navegación en el que quieras agregar una página.
2. Haz clic en **Add a page**.
3. Introduce un nombre de archivo. El editor añade automáticamente la extensión `.mdx`.

<div id="edit-content">
  ## Editar contenido
</div>

Cambia entre el modo visual y Markdown mode mediante el conmutador en la barra de herramientas. El editor web guarda tus cambios al cambiar de modo.

<Frame>
  <img src="/images/editor/mode-toggle-light.png" alt="Conmutador de modo en la barra de herramientas." className="block dark:hidden" />

  <img src="/images/editor/mode-toggle-dark.png" alt="Conmutador de modo en la barra de herramientas." className="hidden dark:block" />
</Frame>

<div id="visual-mode">
  ### Modo visual
</div>

Edita el contenido con vistas previas en tiempo real que muestran cómo se verá el contenido cuando se publique.

* **Agregar texto**: Escribe en el editor para ver cómo se ve el texto cuando se publica.
* **Dar formato al texto**: Usa la barra de herramientas para poner texto en negrita, cursiva o aplicar otros formatos.
* **Agregar componentes**: Presiona <kbd>/</kbd> para abrir el menú de componentes y seleccionar componentes.
* **Agregar imágenes**: Usa el componente de imagen desde el menú <kbd>/</kbd>.
* **Insertar enlaces**: Selecciona texto y presiona <kbd>Cmd</kbd> + <kbd>K</kbd>.

Consulta [Components](/es/components) para obtener la lista completa de componentes disponibles.

<div id="markdown-mode">
  ### Modo Markdown
</div>

Edita el código fuente de MDX.

* **Edición directa de MDX**: Escribe sintaxis de MDX y Markdown para controlar el contenido con precisión.
* **Propiedades de componentes**: Configura las propiedades y opciones de los componentes.
* **Frontmatter**: Edita los metadatos de la página en la parte superior del archivo.

Consulta [Formatear texto](/es/create/text) y [Formatear código](/es/create/code) para obtener más información sobre la sintaxis de MDX.

<div id="configure-pages">
  ## Configurar páginas
</div>

Configura la configuración de las páginas para controlar cómo aparecen en la navigation, en los resultados de búsqueda y en el diseño de tu sitio.

1. Haz clic con el botón derecho en un archivo.
2. Haz clic en **Configure**.

<div id="customize-navigation-appearance">
  ### Personaliza la apariencia de la navegación
</div>

Controla cómo se muestra la página en la barra lateral de navegación de tu sitio.

* **Title**: Define el encabezado principal. Aparece en la navegación, en las pestañas del navegador y en los resultados de búsqueda.
* **Título de la barra lateral**: Muestra un texto más corto en la navegación cuando el título completo es demasiado largo para la barra lateral.
* **Icon**: Añade un marcador visual junto a la página para ayudar a los usuarios a identificarla rápidamente.
* **URL externa**: Enlaza a un sitio externo en lugar de una página. Úsalo para añadir recursos externos a tu navegación.

<div id="optimize-for-search-and-sharing">
  ### Optimiza para búsqueda y para compartir
</div>

Ayuda a los usuarios a encontrar tu página y mejora cómo aparece cuando se comparte.

* **Description**: Escribe un breve resumen. Aparece en los resultados de búsqueda y en las metaetiquetas de SEO.
* **Keywords**: Añade términos de búsqueda relevantes para ayudar a los usuarios a descubrir esta página.
* **OG Image URL**: Configura una imagen de vista previa personalizada para las publicaciones en redes sociales y las vistas previas de enlaces.

<div id="control-page-layout">
  ### Controlar el diseño de la página
</div>

Elige cómo se muestra la página para que se adapte a tus necesidades de contenido.

* **Diseño estándar** (`default`): Página predeterminada con barra lateral de navegación e índice de contenido.
* **Diseño de ancho completo** (`wide`): Oculta el índice de contenido para permitir diseños más anchos para tablas, diagramas u otro contenido.
* **Diseño centrado** (`center`): Oculta la barra lateral y el índice de contenido para mejorar la legibilidad en páginas con mucho texto, como las páginas de cambios.
* **Ancho personalizado** (`custom`): Diseño mínimo con solo la barra de navegación superior para páginas de destino u otros diseños únicos.

<div id="manage-pages">
  ## Administrar páginas
</div>

<div id="move-pages">
  ### Mover páginas
</div>

Arrastra y suelta las páginas para reordenarlas en tu navigation o para mover archivos entre carpetas en el árbol de archivos.

<div id="duplicate-pages">
  ### Duplicar páginas
</div>

Haz clic derecho sobre una página y selecciona **Duplicar**.

<div id="delete-pages">
  ### Eliminar páginas
</div>

Haz clic con el botón derecho en una página y selecciona **Delete**. Al eliminar una página, se quitará automáticamente de tu navigation.

<div id="hide-pages">
  ### Ocultar páginas
</div>

Para quitar una página de navigation sin eliminar el archivo, haz clic derecho sobre la página y selecciona **Hide Page**. La página se mueve a la sección **Unused pages** y no aparecerá en tu sitio publicado. El archivo permanece en tu repositorio y puedes volver a mostrar la página agregándola a la navigation de tu `docs.json`.