Skip to main content
Loading...

Pleasepoint SDK JS: Personaliza one-to-one y en tiempo real la interacción en el eCommerce (Parte 3).

Cómo utilizar el SDK en JS de Pleasepoint para la recomendación de productos en tiempo real en tu eCommerce.


En este post te enseñaremos a utilizar el SDK de Pleasepoint para la recomendación one-to-one utilizando javascript. De esta forma podrás utilizar las funciones del SDK en cualquier momento de interacción del usuario.

Estos son los contenidos del post:

  1. SDK JS: Mejora la experiencia de tus clientes.
  2. Añadir el SDK de Pleasepoint en los scripts JS que carga la página.
  3. Recomendación one-to-one de productos.
  4. Recomendación de productos basada en otro producto (item-item).
  5. Recomendación basada en ranking de productos (ranking one-to-one).
  6. Recomendación basada en bestsellers.
  7. Registrando eventos de interacción.
  8. ¿Por qué debes personalizar one-to-one tu eCommerce con el SDK HTML?

Este post es el tercer de una serie de cuatro posts sobre cómo usar el SDK de Pleasepoint. En este artículo trataremos el uso del SDK en javascript. Te compartimos los enlaces a los otros tres posts:

SDK JS: Hiper-personaliza en tiempo real la experiencia de usuario.

Para maximizar las ventas y la satisfacción del cliente en tu eCommerce, no puedes depender únicamente de una estrategia de "talla única para todos". Cada cliente es único, y tratarlos de manera personalizada marcará la diferencia.



Con el SDK JS de Pleasepoint, pasas a gestionar el uso de la recomendaciones y el registros de eventos en tú código JS. Recomendamos el uso de la versión JS cuando disponemos de toda la información en el frontend para mostrar las recomendaciones y registrar los eventos de interacción. Eventos como el de añadir al carrito es posible que siempre lo realices desde JS.

Si no conoces el SDK de Pleasepoint te recomendamos leer este primer post introductorio.

A continuación te mostramos el código JS para mostrar las recomendaciones y registrar los eventos.

1. Añadir el SDK de Pleasepoint en los scripts JS que carga la página.

Este es el script que debes añadir antes del cierre del body en tu eCommerce. Necesitas que este script se incruste en todas las páginas.

<script type="module" src="https://platform.pleasepoint.com/pleasepoint-widgets/index.js"></script>

2. Mostrar la recomendación one-to-one.

Te compartimos los enlaces sobre cómo utilizar la recomendación one-to-one:

  1. Uso de los parámetros por defecto del widget de recomendación one-to-one de productos.
  2. Uso de los parámetros específicos del widget de recomendación one-to-one de productos.

Este es el código JS para mostrar la recomendación de productos one-to-one.

const widget = pleasepointWidget.create('recommendation', {
    accountId: 'my_account_id',
    numRecommendations: 4,
    cols: 2,
    showSlider: true, // optional, default false
    engine: '', // remove to use best-sellers engine only
    bestSellersEngine: '',
    businessRule: '',
    businessRuleParams: {"param1": ["value1", "value2"]}, // optional
    userReferenceId: '', /* OR */ email: '',
    sessionId: '',
    eventSourcePage: '',
    eventSourceBlock: '' // optional
});

// insert widget into page
document.body.appendChild(widget);

Recuerda que debes modificar los parámetros según tu cuenta de Pleasepoint, la configuración que desees del widget, la identificación del usuario y la sesión.

3. Mostrar la recomendación de productos basada en otro producto (item-item).

Te compartimos los enlaces sobre cómo utilizar la recomendación de productos item-item:

  1. Uso de los parámetros por defecto del widget de recomendación item-item de productos.
  2. Uso de los parámetros específicos del widget de recomendación item-item de productos.

Este es el código JS para mostrar la recomendación item-item.

const widget = pleasepointWidget.create('recommendation', {
    accountId: 'my_account_id',
    numRecommendations: 4,
    cols: 2,
    showSlider: true, // optional, default false
    itemItemEngine: '',
    businessRule: '',
    businessRuleParams: {"param1": ["value1", "value2"]}, // optional
    products: ['product_reference_id1', 'product_reference_id2', ...],
    userReferenceId: '', /* OR */ email: '', // both optional
    sessionId: '',
    eventSourcePage: '',
    eventSourceBlock: '' // optional
});

// insert widget into page
document.body.appendChild(widget);

Recuerda que debes modificar los parámetros según tu cuenta de Pleasepoint, la configuración que desees del widget, la identificación del producto, del usuario y de la sesión.

4. Mostrar el ranking one-to-one.

Te compartimos los enlaces sobre cómo utilizar la recomendación basada en el ranking one-to-one de productos:

  1. Uso de los parámetros por defecto del widget de recomendación basada en ranking one-to-one de productos.
  2. Uso de los parámetros específicos del widget de recomendación basada en ranking one-to-one de productos.

Este es el código JS para mostrar la recomendación basada en ranking one-to-one.

const widget = pleasepointWidget.create('recommendation', {
    accountId: 'my_account_id',
    numRecommendations: 4,
    cols: 2,
    showSlider: true, // optional, default false
    rankingEngine: '',
    businessRule: '',
    businessRuleParams: {"param1": ["value1", "value2"]}, // optional
    userReferenceId: '', /* OR */ email: '',
    sessionId: '',
    productList: 'prod1,prod2',
    eventSourcePage: '',
    eventSourceBlock: '' // optional
});

// insert widget into page
document.body.appendChild(widget);

Recuerda que debes modificar los parámetros según tu cuenta de Pleasepoint, la configuración que desees del widget, la identificación del usuario y la sesión.

5. Mostrar la recomendación de bestsellers.

Te compartimos los enlaces sobre cómo utilizar la recomendación basada en productos bestsellers:

  1. Uso de los parámetros por defecto del widget de recomendación basada en productos bestsellers.
  2. Uso de los parámetros específicos del widget de recomendación basada en productos bestsellers.

Este es el código JS para mostrar la recomendación basada en bestsellers.

const widget = pleasepointWidget.create('recommendation', {
    accountId: 'my_account_id',
    numRecommendations: 4,
    cols: 2,
    showSlider: true, // optional, default false
    bestSellersEngine: '',
    businessRule: '',
    businessRuleParams: {"param1": ["value1", "value2"]}, // optional
    userReferenceId: '', /* OR */ email: '',
    sessionId: '',
    eventSourcePage: '',
    eventSourceBlock: '' // optional
});

// insert widget into page
document.body.appendChild(widget);

Recuerda que debes modificar los parámetros según tu cuenta de Pleasepoint, la configuración que desees del widget, la identificación del usuario y la sesión.

6. Registrar eventos de interacción.

Este es el enlace para ver la descripción de los parámetros para el registro de eventos de interacción.

Este es el código HTML que debes incrustrar para registrar los eventos de interacción.

pleasepointWidget.registerEvent({
    accountId: 'my_account_id',
    apiId: 'my_tracking_id',
    products: ['product_reference_id1', 'product_reference_id2', ...],
    userReferenceId: '', /* OR */ email: '',
    sessionId: '',
    eventType: 'impression' | 'click' | 'add_to_cart' | 'purchase',
    source: '',
    recommendationId: 'recommendation_id' | null,
});

Recuerda que debes modificar los parámetros según tu cuenta de Pleasepoint, la identificación del usuario, la sesión, los productos con los que está interaccionando y el tipo de evento.

¿Por qué debes personalizar one-to-one tu eCommerce con el SDK JS?

Descubre cómo la personalización one-to-one mejorará la tasa de conversión de tu eCommerce utilizando el SDK de Pleasepoint.

El SDK en JS de Pleasepoint es muy práctico cuando tienes la lógica en el lado del cliente. Para utilizar el SDK en JS debes tener acceso a la siguiente información:

  • Id de usuario o email e id de la sesión.
  • Ids de los productos que visualiza o interacciona el usuario.

El registro de eventos de Añadir al carrito es uno de los usos clásicos de este SDK.

Descarga nuestro eBook Introducción al marketing one-to-one y aprende a ejecutar una estrategia híper-personalizada basada en el ciclo de vida y las preferencias de cada uno de tus clientes. Nunca antes había sido tan fácil empezar a híper-pesonalizar e incrementar el rendimiento de tus acciones de marketing.

También te puede interesar...

Resumen del evento con Amazon Web Services en Barcelona.

Participamos en la sesión de IA generativa y marketing predictivo organizada por AWS en sus oficinas de Barcelona.

El modelo de datos de Pleasepoint.

Descripción del modelo de datos utilizado en la plataforma de Pleasepoint. Este artículo está pensado principalmente para la carga inicial de datos.

Lanzamiento de Pleasepoint en el marketplace de AWS.

Estamos orgullosos de anunciar que Pleasepoint ya está disponible en el marketplace de AWS.

Partners de software (ISV) de Amazon Web Services.

Somos partners ISV (Independent Software Vendor) de Amazon Web Services (AWS) y hemos sido seleccionados para el programa de aceleración ISV-Accelerate.

Pleasepoint en AWS Marketplace

"Con Pleasepoint hemos pasado del modelo tradicional de gestión de campañas a un modelo de cliente más dinámico, segmentado y enriquecido, personalizando las campañas de CRM y mejorando la conversión de nuestros clientes del canal de comercio electrónico."

Josep Jarque
Digital Project Manager & IT Architect

"La implementación de la personalización one-to-one nos ha permitido generar contenido mucho más interesante para los usuarios, además de fomentar la fidelización, mejorar la experiencia de compra y generar ventas adicionales a través de recomendaciones personalizadas."

Jose Antonio Linde
COO de Condisline

Nuestros clientes nos avalan.