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

# Crear una página de cancelación de suscripción de correo electrónico personalizada

> Aprenda cómo reemplazar el enlace de cancelación de suscripción predeterminado de OneSignal con una página de preferencias de correo electrónico personalizada, multilingüe y de marca, mientras mantiene el cumplimiento y el seguimiento.

## Descripción general

OneSignal proporciona una [experiencia de cancelación de suscripción predeterminada conforme a correo electrónico](./unsubscribe-links-email-subscriptions) que inyecta un enlace en sus plantillas de correo electrónico para que los usuarios puedan cancelar su suscripción con facilidad y sus [estados de suscripción](./subscriptions) se actualicen en tiempo real. Si desea control total sobre la marca, el texto y los campos (como exclusiones por categoría), puede reemplazar el enlace predeterminado con su propia página personalizada y usar la API de OneSignal para cancelar la suscripción o actualizar las preferencias del usuario.

Esta guía explica cómo agregar su propia página de cancelación de suscripción personalizada a los correos electrónicos (eliminando el enlace predeterminado de OneSignal) y cuáles de nuestras APIs usar para cancelar la suscripción de correo electrónico del usuario.

Si desea agregar más funcionalidad a su página de cancelación de suscripción personalizada (como exclusión de categorías de correo electrónico específicas en lugar de todas), esto se detalla en nuestro tutorial del [Centro de preferencias](./preference-center).

***

## Eliminar el enlace de cancelación de suscripción predeterminado de OneSignal

OneSignal inserta automáticamente un enlace especial en el formato `[unsubscribe_url]` en sus plantillas de correo electrónico. Esta URL cancela la suscripción del usuario de todos los correos electrónicos en OneSignal. Consulte [Enlaces de cancelación de suscripción de correo electrónico](./unsubscribe-links-email-subscriptions) para más detalles.

Para usar su propia página, **localice y elimine el enlace predeterminado** en su plantilla.

<Tabs>
  <Tab title="Editor Drag-and-Drop">
    En el editor drag-and-drop, el enlace predeterminado puede aparecer anidado como:

    <Frame caption="Enlace de cancelación de suscripción del editor Drag-and-Drop">
      <img src="https://mintcdn.com/onesignal/0qspEXXeJ8zJbkJ-/images/docs/82cc033-Default_Unsubscribe.png?fit=max&auto=format&n=0qspEXXeJ8zJbkJ-&q=85&s=3c507499bbc29854761df1136f8c0ff4" alt="Enlace de cancelación de suscripción del editor Drag-and-Drop" width="1598" height="1203" data-path="images/docs/82cc033-Default_Unsubscribe.png" />
    </Frame>
  </Tab>

  <Tab title="Editor HTML">
    ```html theme={null}
    <a href="[unsubscribe_url]">Unsubscribe</a>
    ```
  </Tab>
</Tabs>

***

## Agregar su enlace de cancelación de suscripción personalizado

Ahora que ha eliminado nuestro enlace especial, puede reemplazarlo con su propia URL.

Muchas veces, estos enlaces requieren que se pasen algunos datos adicionales a su página. Use [variables de Liquid](./message-personalization) para pasar datos de OneSignal a su página.

Parámetros comunes:

| Parámetro                        | Descripción                                    |
| -------------------------------- | ---------------------------------------------- |
| `subscription.email`             | Dirección de correo electrónico del suscriptor |
| `subscription.external_id`       | ID externo del usuario                         |
| `app.id`                         | ID de aplicación de OneSignal                  |
| `message.id`                     | ID de la notificación de correo electrónico    |
| `subscription.language`          | Idioma preferido (para localización)           |
| `subscription.unsubscribe_token` | Token de seguridad para verificación de API    |

**URL de ejemplo:**

```liquid theme={null}
https://examplesite.com/unsubscribe?app_id={{app.id}}&notification_id={{message.id}}&email={{subscription.email}}&language={{subscription.language}}&token={{subscription.unsubscribe_token}}
```

```html HTML theme={null}
  <div style="text-align: center;">
    <a
      href="https://examplesite.com/unsubscribe?app_id={{app.id}}&notification_id={{message.id}}&email={{subscription.email}}&language={{subscription.language}}&token={{subscription.unsubscribe_token}}"
      data-disable-tracking="true"
      style="display: inline; text-decoration: none;"
    >
      Unsubscribe
    </a>
    <p style="display: inline;"> from our emails</p>
  </div>
```

<Frame caption="Agregar enlace de cancelación de suscripción personalizado">
  <img src="https://mintcdn.com/onesignal/6v_cVPknFpo5qSVB/images/docs/0c94ab0-HTML_unsubscribe_custom.png?fit=max&auto=format&n=6v_cVPknFpo5qSVB&q=85&s=e931f0e8649ea80d29194e0db2722942" alt="Agregar enlace de cancelación de suscripción personalizado" width="1606" height="1175" data-path="images/docs/0c94ab0-HTML_unsubscribe_custom.png" />
</Frame>

### Deshabilitar el seguimiento de clics

Los clics de cancelación de suscripción generalmente no se usan para métricas de participación. Si desea deshabilitar el seguimiento de enlaces, puede agregar el atributo `data-disable-tracking="true"` a su enlace de esta manera:

```html HTML theme={null}
  <a
    href="https://www.examplesite.com/unsubscribe?app_id={{app.id}}&notification_id={{message.id}}&email={{subscription.email}}&language={{subscription.language}}&token={{subscription.unsubscribe_token}}"
    data-disable-tracking="true"
  >
    Unsubscribe
  </a>
```

**Atributos específicos del proveedor:**

| Proveedor | Atributo                       |
| --------- | ------------------------------ |
| OneSignal | `data-disable-tracking="true"` |
| Mailgun   | `disable-tracking=true`        |
| SendGrid  | `clicktracking=off`            |
| Mandrill  | `mc:disable-tracking`          |

***

## Alojar su página de cancelación de suscripción personalizada

Implemente una página web que:

* Lea los parámetros de consulta del enlace de cancelación de suscripción.
* Muestre opciones de exclusión o preferencias fáciles de usar.
* Envíe la solicitud de cancelación de suscripción o actualización a OneSignal a través de la API.

<Info> Proporcionamos un [proyecto de muestra de GitHub](https://github.com/OneSignalDevelopers/custom-email-unsubscribe-page-sample) funcional que puede bifurcar e implementar. </Info>

<Frame caption="UI de página de cancelación de suscripción de muestra">
  <img src="https://mintcdn.com/onesignal/jBdBk5XvQR5eKOks/images/docs/75a39d1-Github_page.png?fit=max&auto=format&n=jBdBk5XvQR5eKOks&q=85&s=4d1b004b41a3ad4bd3e7c4f76da7e9fc" alt="Página de cancelación de suscripción de muestra" width="1448" height="1438" data-path="images/docs/75a39d1-Github_page.png" />
</Frame>

***

## Llamar a la API de OneSignal

Dependiendo de su caso de uso, puede usar las siguientes APIs para cancelar la suscripción o actualizar las preferencias del usuario:

* [Actualizar suscripción por token](/reference/update-subscription-by-token)
* [Cancelar suscripción de correo electrónico con token](/reference/unsubscribe-with-token)
* [Actualizar usuario](/reference/update-user)

<Tabs>
  <Tab title="Actualizar suscripción por token">
    Esta API se usa más comúnmente cuando tiene la dirección de correo electrónico del usuario y solo desea suscribirlo o cancelar su suscripción de todos los correos electrónicos.

    **Parámetros de consulta requeridos:**

    * `app_id`
    * `token`

    **Autenticación requerida**

    * Llame a esta API desde su servidor.
  </Tab>

  <Tab title="Cancelar suscripción de correo electrónico con token">
    Use esta API si desea rastrear qué correo electrónico específico causó la cancelación de suscripción. Esto usa el ID del mensaje de correo electrónico para rastrear la cancelación de suscripción. Consulte la API [Cancelar suscripción de correo electrónico con token](/reference/unsubscribe-with-token) para más detalles.

    **Parámetros de consulta requeridos:**

    * `app_id`
    * `notification_id`
    * `token`

    **Parámetros opcionales:**

    * `email`
    * `language`

    **Ejemplo de JavaScript:**

    ```javascript JavaScript theme={null}
    const unsubscribeURL = (href) => {
      const unsubscribeURL = new URL(href)
      const appID = unsubscribeURL.searchParams.get("app_id")
      const notificationID = unsubscribeURL.searchParams.get("notification_id")
      const unsubscribeToken = unsubscribeURL.searchParams.get("token")
      const language = unsubscribeURL.searchParams.get("language")
      const email = unsubscribeURL.searchParams.get("email")
      return {
        unsubscribeURL: `https://api.onesignal.com/apps/${appID}/notifications/${notificationID}/unsubscribe?token=${unsubscribeToken}`,
        meta: { language, email },
      }
    }
    ```
  </Tab>

  <Tab title="Actualizar usuario">
    Actualice las preferencias del usuario usando la API [Actualizar usuario](/reference/update-user).

    **Parámetros de consulta requeridos:**

    * `app_id`
    * `alias_id` - Se recomienda el ID externo del usuario.

    **Autenticación requerida**

    * Llame a esta API desde su servidor.
  </Tab>
</Tabs>

***

<Check>
  Ahora debería estar equipado con todo lo que necesita saber sobre cómo crear una página de cancelación de suscripción personalizada.
</Check>

***