> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mercantis.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Portada

La **portada** es lo primero que ve el comprador en el inicio: imagen o ilustración, textos, CTA y, si querés, tus redes. Es el gancho visual de la tienda.

## Dónde configurarlo

Desde el menú lateral, entrá a **Diseño → Portada**.

<Frame>
  <img src="https://mintcdn.com/mercantis/wuY5S_zbFSMo2yG6/images/docs/portada-diseno.webp?fit=max&auto=format&n=wuY5S_zbFSMo2yG6&q=85&s=1bb4d54cdff00a9e2b44817d88f2a444" alt="Editor de diseño: Portada con imagen, textos, tono y preview de la tienda" width="1024" height="768" data-path="images/docs/portada-diseno.webp" />
</Frame>

## Tipo de fondo

Podés elegir:

* **Imagen**: covers de la plataforma o **tu propia foto**, con recorte para escritorio y celular
* **SVG**: fondos ilustrados (por ejemplo Ondas, Flujo, Arco)

Con imagen también podés ajustar **tono** y **desenfoque**.

<Frame>
  <img src="https://mintcdn.com/mercantis/4Uy3hrDnn9kZhYiC/images/2026-07-21-recorte-hero.webp?fit=max&auto=format&n=4Uy3hrDnn9kZhYiC&q=85&s=caa7881760723339eb45cfba3197e3b2" alt="Recortar portada: vista escritorio y celular" width="1024" height="768" data-path="images/2026-07-21-recorte-hero.webp" />
</Frame>

## Textos sobre la portada

* Título
* Descripción
* Botón / CTA (si aplica)
* Contraste y tipografía para que se lean bien sobre el fondo

## Redes en la portada

Podés mostrar las redes cargadas en [Ajustes → General](/documentacion/tienda/logo-y-colores) con estilo:

* **Barra** o **Pastilla**
* Transparencia del bloque

Si no cargaste URLs de redes en General, no hay nada que mostrar acá.

## Cómo configurarla

<Steps>
  <Step title="Abrí Portada">
    Entrá a **Diseño → Portada**.
  </Step>

  <Step title="Elegí el fondo">
    **Imagen** o **SVG**.
  </Step>

  <Step title="Recortá si es foto propia">
    Subí el archivo, **recortá** para escritorio y celular, y confirmá.
  </Step>

  <Step title="Completá textos">
    Título, descripción, CTA y contraste.
  </Step>

  <Step title="Redes y guardado">
    Activá redes en portada si querés, revisá ambas vistas y **Guardá cambios**.
  </Step>
</Steps>

## Relacionado

* [Logo, colores y datos](/documentacion/tienda/logo-y-colores)
* [Categorías en el inicio](/documentacion/tienda/categorias-en-inicio)
* [Editor de diseño](/documentacion/tienda/editor-de-diseno)