---
title: "Crear un paywall con alternador de prueba gratuita"
description: "Alterna un paywall entre productos con y sin prueba gratuita, y mantén el producto seleccionado sincronizado con el alternador."
---

> **AI agents**: to search Adapty docs faster and with fewer tokens, install the Adapty skill. Claude Code (self-updating via plugin): `claude plugin marketplace add adaptyteam/adapty-skills && claude plugin install adapty-skills@adapty` — other tools: `npx skills add adaptyteam/adapty-skills --all`

Un alternador de prueba gratuita te permite cambiar un paywall entre productos con prueba gratuita y productos sin ella. Pero el alternador en sí es solo un interruptor: activado o desactivado. Tú escribes las reglas que muestran las tarjetas correctas y las reglas que cambian qué producto está seleccionado.

Esta receta te muestra cómo configurar estas reglas y crear un paywall completamente funcional con toggle.

<DocVideo id="paywall-trial-toggle-demo.mp4" width="300px" alt="El paywall terminado: activar el toggle de prueba cambia ambas tarjetas de producto a sus versiones de prueba y actualiza la etiqueta del botón de 'Purchase' a 'Start your free trial'" />

## Antes de empezar \{#before-you-start\}

- Construye una pantalla de paywall — por ejemplo, sigue la receta [Crear una pantalla de paywall básica](basic-paywall-screen).
- [Crea tus productos](create-product) y [añádeles la oferta de prueba](create-offer).

:::important
Si quieres que la prueba sea opcional (lo cual es necesario para usar el toggle de prueba), no crees una oferta introductoria. En iOS, las ofertas introductorias se aplican **automáticamente** a todos los usuarios elegibles. No puedes desactivarlas. Usa una oferta promocional en su lugar. Consulta [Cómo funciona Adapty con las ofertas](create-offer#how-adapty-works-with-offers).
:::

## 1. Añadir las tarjetas de producto \{#1-add-the-product-cards\}

1. Haz clic en el menú **+** > **Paywall & Commerce** > **Products** y elige un preset.
2. Selecciona una tarjeta — en el canvas o en el panel **Layers**. Asigna un producto a la tarjeta y deja **Select offer (optional)** vacío.
3. Repite el proceso con cada plan que vendas: una tarjeta por plan, sin la prueba gratuita.
4. Duplica cada tarjeta. En cada copia, elige la oferta de prueba en **Select offer (optional)**.

Ahora cada plan tiene dos tarjetas que apuntan al mismo producto: una con la oferta y otra sin ella.

## 2. Añade el toggle de prueba \{#2-add-the-trial-toggle\}

1. Haz clic en **+** > **Paywall & Commerce** > **Trial Toggle**.

2. Asegúrate de que el toggle pertenece a un grupo seleccionable del tipo correcto. Haz clic en un área vacía del canvas para abrir **Screen settings**. En **Selectable groups**, abre `trial_toggle`, establece **Group Type** en **Toggle** y haz clic en **Save**. El cuadro de diálogo muestra la variable que usaremos para detectar si el toggle está activado: `trial_toggle.isActive`.

3. Edita la etiqueta del toggle.

Deja el toggle desactivado por defecto. Un toggle de prueba preseleccionado puede provocar el rechazo en la App Store por considerarse un patrón oscuro — consulta [Toggles](builder-toggles).

## 3. Muestra las tarjetas correctas según el estado del toggle \{#show-the-right-cards-for-each-toggle-state\}

En la pestaña **Design** de cada tarjeta, en **Visibility**, selecciona **Conditional** y define su condición:

| Tarjeta | Condición |
|---|---|
| Con el trial | `trial_toggle.isActive` **Equals** **True** |
| Sin el trial | `trial_toggle.isActive` **Equals** **False** |

## 4. Selecciona una tarjeta visible cuando cambia el toggle \{#4-select-a-visible-card-when-the-toggle-changes\}

Las tarjetas ahora cambian con el toggle, pero el producto seleccionado no. Una tarjeta que se vuelve invisible sigue seleccionada, y la acción **Purchase** sigue apuntando a ella — así que un usuario que activa el período de prueba podría seguir siendo cobrado.

Añade una **Conditional Action** al toggle para que reinicie la selección a una tarjeta visible en cada toque.

1. En el panel **Layers**, selecciona el contenedor **Trial toggle**.
2. Abre la pestaña **Interactions**, añade el disparador **On tap** y una **Conditional Action**:

| Bloque | Qué configurar |
    |---|---|
    | **if** | `trial_toggle.isActive` **Equals** **True** |
    | **then** | **Select Product**, apuntando a una tarjeta con el trial |
    | **else** | **Select Product**, apuntando al mismo producto sin el trial |

## 5. Actualiza la etiqueta del botón \{#update-the-button-label\}

La llamada a la acción debe mostrar un texto diferente cuando el período de prueba está activo.

1. Selecciona el elemento de texto del botón.
2. En la pestaña **Design**, dentro de **Content**, selecciona **Conditional** y haz clic en **Edit conditions**.
3. Rellena los bloques:

    | Bloque | Qué configurar |
    |---|---|
    | **if** | `trial_toggle.isActive` **Equals** **True** |
    | **then** | La etiqueta para el período de prueba, por ejemplo `Start your free trial` |
    | **else** | La etiqueta estándar, por ejemplo `Purchase` |

Para más información sobre el texto condicional, consulta [Añadir texto condicional](onboarding-text#add-conditional-text).