- **Products as purchase buttons**: Cada producto es un botón, y la compra comienza cuando el usuario pulsa el botón de ese producto.
## Color de fondo \{#background-color\}
Mantén la coherencia visual estableciendo un fondo predeterminado para tu paywall. Usa el campo **Background color** en los **Layout settings**. Haz clic en el cuadrado de color para abrir la ventana de configuración, donde puedes elegir un color sólido o un degradado en pestañas separadas.
## Ajustes de fuente de tu paywall \{#font-settings-of-your-paywall\}
Es importante que el paywall sea visualmente coherente con el resto de tu app, y uno de los factores visuales más importantes es la fuente que usas. Puedes elegir simplemente usar la fuente del sistema (SF Pro para iOS, Roboto para Android), usar una de las fuentes comunes disponibles o subir tu propia fuente personalizada:
Los ajustes de fuente en los **Layout settings** se aplican a todos los componentes del paywall de forma predeterminada. Puedes sobrescribir estos ajustes para elementos específicos, como cuadros de texto o listas, al editarlos individualmente. Si cambias la fuente predeterminada en los **Layout settings**, no afectará a los elementos que ya tengan fuentes individuales. Aprende cómo subir una fuente personalizada [aquí](using-custom-fonts-in-paywall-builder).
## Layout del contenido \{#content-layout\}
No tienes que ajustar manualmente los márgenes y el ancho de cada elemento de contenido del paywall. Ve a **Content layout** para modificar todos los ajustes siguientes para todos los elementos de contenido a la vez:
- **Default child margin**: Define el espacio alrededor de cada elemento hijo.
- **Spacing**: Define el espacio entre elementos dentro de un layout.
- **Max width**: Establece el ancho máximo de los elementos para optimizar el layout en iPads. Recomendamos 600pt para un diseño limpio y equilibrado.
:::warning
El parámetro Max width solo está disponible a partir de Adapty SDK v3.7.0 o superior.
:::
Para ajustar el layout de un elemento específico —como establecer el ancho máximo del footer— ve a la sección **Layout** en **App Icon, Header, Feature List, Products** o **Footer**.
## Botones superiores \{#top-buttons\}
Añade hasta 2 botones superiores a tu paywall para ofrecer a los usuarios opciones como cerrar el paywall. Personaliza su apariencia y comportamiento de la siguiente manera:
1. Activa el toggle **Top Button** o **Top Button 2**.
2. Elige el aspecto y la posición del botón. La vista previa se actualizará al instante.
| Ajuste del botón | Descripción |
|--------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| Action | Elige la acción que el paywall debe ejecutar cuando un usuario pulse este botón. Si eliges acciones estándar, el paywall generará un evento estándar que podrás gestionar de forma estándar en el código de tu app.
Si eliges una acción personalizada, deberás procesar la acción por su `CustomActionID` en el código de tu app.
| | Style | Elige si quieres que el botón tenga aspecto de icono o de texto. Si eliges un icono, selecciona el tipo de icono en el campo correspondiente. | 3. Para retrasar la aparición del botón, ajusta el control deslizante **Show after delay**.