Configuración de la compatibilidad con la mensajería web en la aplicación en el SDK web

Los mensajes en la aplicación son notificaciones que puede enviar a los usuarios dentro de su aplicación web, guiándolos a puntos de interés específicos.

Puede utilizar estas notificaciones para diferentes fines, como promocionar nuevas funciones, presentar ofertas especiales o facilitar la incorporación del usuario.

Con los mensajes en la aplicación, puede interactuar de forma eficaz con su audiencia y dirigirla a aspectos importantes de su aplicación.

IMPORTANT
La mensajería web en la aplicación es una característica de Adobe Journey Optimizer que usa el SDK web para entregar el contenido personalizado.
Para obtener instrucciones detalladas sobre cómo configurar su campaña de mensajería en la aplicación web, consulte la documentación de Adobe Journey Optimizer.

Requisitos previos prerequisites

Versión de extensión de etiqueta de SDK web extension-version

La funcionalidad de mensajería en la aplicación web requiere la última versión de la extensión de etiqueta del SDK web.

Configuración de un CSP para mensajería web en la aplicación csp

Al configurar Mensajería en la aplicación web, debe incluir la siguiente directiva en su CSP:

default-src  blob:;

Para obtener más información acerca de cómo configurar un CSP, consulte la documentación dedicada.

Configuración de la mensajería web en la aplicación mediante la extensión de etiqueta del SDK web tag-extension

Consulte la página de configuración de la extensión de etiquetas del SDK web para saber dónde puede encontrar la configuración que se describe a continuación.

Después de haber instalado la extensión de etiqueta del SDK web, siga los pasos a continuación para configurar la extensión para la mensajería web en la aplicación.

En la sección Personalization, marque la opción Habilitar almacenamiento personalizado. Esta opción permite al SDK web realizar un seguimiento de las experiencias que el usuario ha visto en las cargas de página.

Imagen que muestra la opción de almacenamiento personalizado en la página de configuración de la extensión de etiqueta.

La mensajería web en la aplicación admite dos tipos de déclencheur:

Consulte las secciones siguientes para configurar la extensión de etiquetas del SDK web según los déclencheur que desee utilizar.

Pasos de configuración para el déclencheur Enviar datos a la plataforma send-data-platform

Seleccione la propiedad de etiqueta que contiene su extensión del SDK web y cree una nueva regla con la siguiente configuración:

  1. Extensión: Principal

  2. Tipo de evento: Biblioteca cargada (Principio de página)

    Imagen que muestra la pantalla de configuración del evento.

  3. Seleccione Conservar cambios para guardar la configuración del evento.

A continuación, debe agregar una acción a la regla que ha creado.

  1. En la sección Actions, seleccione Agregar.
    Imagen que muestra la pantalla de edición de regla.

  2. Usar la siguiente configuración de Acción:

    • Extensión: SDK web de Adobe Experience Platform

    • Tipo de acción: Enviar evento

      Imagen que muestra la pantalla de configuración de la acción.

  3. En el lado derecho de la pantalla, en la sección Personalization, habilite la opción Procesar decisiones de personalización visuales.
    Imagen que muestra la pantalla de configuración de personalización.

  4. En el lado derecho de la pantalla, en la sección Contexto de decisión, defina los pares de Clave/Valor que utilizó en la configuración de su campaña para cumplir los requisitos para el mensaje en la aplicación.
    Imagen que muestra la pantalla de configuración de personalización.

  5. Seleccione Conservar cambios para guardar la configuración.

A continuación, debe agregar la regla recién creada a la biblioteca de propiedades de etiquetas. Para ello, vaya a Flujo de publicación y seleccione la regla que creó anteriormente.

Imagen que muestra la pantalla de la biblioteca.

Después de agregar la regla a la biblioteca, seleccione Guardar y generar en desarrollo.

Imagen que muestra la pantalla de configuración de personalización.

El proceso de configuración se ha completado y el mensaje está listo para mostrarse a los usuarios.

Pasos de configuración para utilizar déclencheur manuales manual-trigger

Seleccione la propiedad de etiqueta que contiene su extensión del SDK web y cree una nueva regla con la siguiente configuración:

  1. Extensión: Principal

  2. Tipo de evento: Haga clic

  3. Establezca el déclencheur de un elemento específico de la página, identificado por un selector CSS de su elección.

    Imagen que muestra la pantalla de configuración del evento.

A continuación, debe agregar una acción a la regla que ha creado.

  1. En la sección Actions, seleccione Agregar.
    Imagen que muestra la pantalla de edición de regla.

  2. Usar la siguiente configuración de Acción:

    • Extensión: SDK web de Adobe Experience Platform

    • Tipo de acción: Evaluar conjuntos de reglas

      Imagen que muestra la pantalla de configuración de la acción.

  3. En el lado derecho de la pantalla, habilite la opción Procesar decisiones de personalización visuales.
    Imagen que muestra la pantalla de configuración de personalización.

  4. En el lado derecho de la pantalla, en la sección Contexto de decisión, defina los pares de Clave/Valor que utilizó en la configuración de su campaña para cumplir los requisitos para el mensaje en la aplicación.
    Imagen que muestra la pantalla de configuración de personalización.

  5. Seleccione Conservar cambios para guardar la configuración.

A continuación, debe agregar la regla recién creada a la biblioteca de propiedades de etiquetas. Para ello, vaya a Flujo de publicación y seleccione la regla que creó anteriormente.

Imagen que muestra la pantalla de la biblioteca.

Después de agregar la regla a la biblioteca, seleccione Guardar y generar en desarrollo.

Imagen que muestra la pantalla de configuración de personalización.

El proceso de configuración se ha completado y el mensaje está listo para mostrarse a los usuarios.

Configuración de la mensajería web en la aplicación mediante la biblioteca JavaScript del SDK web js-library

Como alternativa al uso de la extensión de etiqueta del SDK web, también puede configurar la mensajería en la aplicación web directamente desde la biblioteca de JavaScript del SDK web.

Puede mostrar mensajes web en la aplicación desde Adobe Journey Optimizer de dos formas.

Método 1: Recuperación automática del contenido personalizado automatic

Para que el SDK web recupere automáticamente el contenido de personalización al cargar la página, utilice el comando sendEvent, como se muestra en el ejemplo siguiente.

  alloy("sendEvent", {
      renderDecisions: true,
      personalization: {
          surfaces: ['#welcome']
      }
  });

Método 2: Recuperación manual del contenido de personalización en función de la acción del usuario manual

Para mostrar el contenido personalizado solo después de que el usuario realice una acción específica, utilice el comando evaluateRulesets como se muestra en el ejemplo siguiente.

En este ejemplo, el contenido de personalización se muestra cuando un usuario hace clic en el botón Comprar ahora del sitio web.

 alloy("evaluateRulesets", {
     renderDecisions: true,
     personalization: {
         decisionContext: {
             "userAction": "buy_now"
         }
     }
 });

Configuración del almacenamiento de personalización personalization-storage

Puede elegir mostrar mensajes en la aplicación a los usuarios una cantidad determinada de veces, o cada vez que visiten una página, mediante la opción de configuración personalizationStorageEnabled.

En la configuración del SDK web establezca la opción personalizationStorageEnabled según sus necesidades:

  • personalizationStorageEnabled: true almacena en déclencheur el mensaje en la aplicación con la frecuencia que definió en Adobe Journey Optimizer campaign.
  • personalizationStorageEnabled: false almacena en déclencheur el mensaje en la aplicación en cada carga de página.
recommendation-more-help
ad108910-6329-42f1-aa1d-5920a2b13636