> ## Documentation Index
> Fetch the complete documentation index at: https://omer-914cc1c6.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Páginas

> Las páginas son los bloques fundamentales de tu documentación

Cada página es un archivo MDX, que combina contenido en Markdown con componentes de React para que puedas crear documentación rica e interactiva.

<div id="page-metadata">
  ## Metadata de la página
</div>

Cada página comienza con frontmatter, la metadata en YAML delimitada por `---` al inicio de un archivo. Esta metadata define cómo se muestra y cómo se comporta tu página.

Usa la metadata para controlar:

* Títulos y descripciones de la página
* Títulos, iconos y tags de la barra lateral

<ResponseField name="title" type="string" required>
  El título de tu página que aparece en la navigation y en las pestañas del navegador.
</ResponseField>

<ResponseField name="description" type="string">
  Una breve descripción de lo que trata esta página. Aparece debajo del título y mejora el SEO (Search Engine Optimization).
</ResponseField>

<ResponseField name="sidebarTitle" type="string">
  Un título breve que se muestra en la navigation de la barra lateral.
</ResponseField>

<ResponseField name="icon" type="string">
  El icono que se mostrará.

  Opciones:

  * Nombre del [icono de Font Awesome](https://fontawesome.com/icons)
  * Nombre del [icono de Lucide](https://lucide.dev/icons)
  * URL a un icono alojado externamente
  * Ruta a un archivo de icono en tu proyecto
</ResponseField>

<ResponseField name="iconType" type="string">
  El estilo de icono de [Font Awesome](https://fontawesome.com/icons). Solo se usa con iconos de Font Awesome.

  Opciones: `regular`, `solid`, `light`, `thin`, `sharp-solid`, `duotone`, `brands`.
</ResponseField>

<ResponseField name="tag" type="string">
  Un tag que aparece junto al título de tu página en la barra lateral.
</ResponseField>

```yaml Example YAML frontmatter wrap theme={null}
---
title: "Acerca del frontmatter"
description: "El frontmatter es el metadata que controla cómo aparece y se comporta tu página"
sidebarTitle: "Frontmatter"
icon: "book"
tag: "NEW"
---
```

<div id="page-mode">
  ## Modo de página
</div>

Controla cómo se muestra tu página con el ajuste `mode`.

<div id="default">
  ### Predeterminado
</div>

Si no se define un modo, se utiliza por defecto un diseño estándar con una navigation lateral y una tabla de contenido.

```yaml theme={null}
---
title: "Título de página predeterminado"
---
```

<div id="wide">
  ### Ancho
</div>

El modo ancho oculta la tabla de contenidos. Es útil para páginas sin encabezados o si prefieres aprovechar el espacio horizontal adicional. El modo ancho está disponible en todos los temas.

```yaml theme={null}
---
title: "Título de página amplia"
mode: "wide"
---
```

<div id="custom">
  ### Personalizado
</div>

El modo personalizado ofrece un diseño minimalista que elimina todos los elementos excepto la barra superior. Es un lienzo en blanco para crear páginas de destino u otros diseños únicos en los que quieras mantener al mínimo los elementos de navigation. El modo personalizado está disponible para todos los temas.

```yaml theme={null}
---
title: "Título de página personalizado"
mode: "custom"
---
```

<div id="frame">
  ### Frame
</div>

El modo Frame ofrece un diseño similar al modo personalizado, pero conserva la navegación de la barra lateral. Este modo de página permite usar HTML y componentes personalizados mientras mantiene la experiencia de navegación predeterminada. El modo Frame solo está disponible en los temas Aspen y Almond.

```yaml theme={null}
---
title: "Título de página Frame"
mode: "frame"
---
```

<div id="center">
  ### Centrado
</div>

El modo centrado elimina la barra lateral y la tabla de contenidos y centra el contenido. Es útil para páginas de cambios u otras en las que quieras destacar el contenido. El modo centrado está disponible en los temas Mint y Linden.

```yaml theme={null}
---
title: "Centrar título de página"
mode: "center"
---
```

<div id="api-pages">
  ## Páginas de API
</div>

Crea áreas de pruebas de la API interactivas añadiendo una especificación de la API a tu frontmatter, `api` u `openapi`.

```yaml theme={null}
---
openapi: "GET /endpoint"
---
```

Obtén más información sobre cómo crear [documentación de API](/es/api-playground/overview).

<div id="external-links">
  ## Enlaces externos
</div>

Vincula sitios externos directamente desde tu navigation con la metadata `url`.

```yaml theme={null}
---
title: "Paquete npm"
url: "https://www.npmjs.com/package/mint"
---
```

<div id="search-engine-optimization">
  ## Optimización para motores de búsqueda
</div>

La mayoría de las metaetiquetas de SEO se generan automáticamente. Puedes establecer manualmente las metaetiquetas de SEO para mejorar el SEO de tu sitio, el uso compartido en redes sociales y la compatibilidad con los navegadores.

<Note>
  Las metaetiquetas con dos puntos deben ir entre comillas.
</Note>

```yaml theme={null}
---
"twitter:image": "/images/social-preview.jpg"
---
```

Consulta [SEO](/es/settings/seo) para ver todas las opciones de metadata de SEO.

<div id="internal-search-keywords">
  ## Palabras clave de búsqueda interna
</div>

Mejora la capacidad de descubrimiento de una página específica en la búsqueda integrada proporcionando `keywords` en tu metadata. Estas palabras clave no aparecerán en el contenido de la página ni en los resultados de búsqueda, pero si los usuarios las buscan, se mostrará la página como resultado.

```yaml theme={null}
---
keywords: ['configuración', 'configuración inicial', 'primeros pasos']
---
```
