Introducción
Esta guía te mostrará instrucciones paso a paso sobre cómo crear una notificación de recomendación de un producto desde cero.
Este feature te permitirá disponibilizar a los usuarios del sitio web un listado de productos recomendados de manera dinámica y personalizada; es decir, que cada cliente verá un producto hecho exclusivamente para él.
🚀 Comencemos
Desde el área de personalizaciones haz clic en el botón “Nueva personalización”; asígnale un nombre y elige un tipo de personalización. En este ejemplo utilizaremos la opción Popup.
2. Elige la posición que ocupará ese pop-up en tu sitio web. ¡No te preocupes! si todavía no estás seguro, simplemente elige cualquiera de las opciones disponible y luego podrás seleccionar su correcta ubicación.
3. Haz clic en “crear personalización” para acceder al editor y comenzar a diseñar tu elemento de personalización web.
4. Comienza a agregar sobre tu diseño los elementos principales del touchpoint.
Elemento de imagen: en las propiedades del contenido, configura la variable en el campo imagen dinámica.
Elemento de texto: aquí puedes agregar otras variables como el nombre, la descripción y el precio del producto.
Elemento de botón: en las propiedades del botón, configura la variable en el campo tipo de URL.
Mas abajo, en este documento, revisa todas las variables que puedes incluir para personalizar el contenido dinámico.
5. Una vez que tengas configurados todos los elementos del touchpoint, haz clic en la parte externa de la fila de contenido y en las propiedades de la fila, configura la sección “contenido dinámico”. Primero debes hacer clic en el boton “selecciona una condición”.
6. Selecciona la opción “Recomendación de productos en grilla” y en el paso siguiente, elige la opcion “Grilla x 1”
7. Una vez configurado esto, primero haz clic en el botón “guardar” sobre el margen superior derecho del editor y luego se te habilitará el botón “propiedades” a la izquierda del mismo.
8. En la sección de propiedades, primero activa la opción de “contenido dinámico”. Desde esta sección podrás configurar la cantidad de productos a mostrar, te recomendamos seleccionar 1; y luego aplicar una estrategia de recomendación.
9. Cuando configures las propiedades de la estrategia de recomendacion, tu touchpoint se verá asi:
10. Listo! ahora continua revisando todas las configuraciones avanzadas en estilos y apariencia del touchpoint para darle el toque final. Podrás cambiar la posición del touchpoint, configurar animaciones de entrada y salida, tiempos de cierre automáticos y muchas opciones más! Cuando finalices, haz clic en “guardar” y cierra la ventana de propiedades para volver a editor.
11. Ahora que ya está listo el diseño de tu touchpoint, configuremos las propiedades de visualización y personalización web. Para ello, haz clic en la flecha que se encuentra junto al nombre del touchpoint
12. En esta página podrás configurar todas las opciones de visualización antes de su publicación final.
¿Cuándo mostrar el elemento web?: Configura el disparador, la frecuencia y, si es necesario, fechas de publicación.
¿Dónde mostrar el elemento web?: selecciona en qué tipo de páginas y dispositivos debe aparecer.
¿Quien debe ver el elemento web?: configura las características de tu audiencia para que solo se le muestre a la persona correcta.
¡AHORA SI! Tu touchpoint esta listo para publicarse. Recuerda que antes de activarlo, puedes hacer clic en el botón “vista previa” para ver la versión final. Si ya estás seguro, simplemente haz clic en “publicar” y tu touchpoint comenzará a estar visible según las condiciones configuradas.
Listado de variables que puedes utilizar en tus bloques de contenido.
A continuación, te contamos cuáles son todas las variables que puedes utilizar para personalizar tu bloque de contenido.
Variable | Respuesta |
{{product.image}} | Imagen del producto |
{{product.name}} | Nombre del producto |
{{product.sku}} | SKU del producto |
{{product.stock}} | Stock disponible del producto |
{{product.price}} | Precio del producto |
{{product.price_sale}} | Precio con descuento del producto |
{{product.link}} | URL del producto |
{{product.description}} | Descripción del producto |
{{product.discount_percentage}} | Porcentaje de descuento del producto |
{{product.discount_amount}} | Importe de descuento del producto |
{{profile.firstname}} | Nombre del usuario, siempre y cuando se conozca el perfil. |
{{cart.summary.total}} | Valor del carrito abandonado. La podes utilizar de manera general siempre y cuando se conozca el perfil y tenga carrito abandonado. |
{{cart.url_recovery}} | URL del carrito abanadonado. La podes utilizar de manera general siempre y cuando se conozca el perfil y tenga carrito abandonado. |
{{current_category.name}} | Nombre de la categoria |
{{current_product.name}} | Nombre del producto que está visitando |
{{current_product.stock}} | Stock del producto que está visitando. |
☝️ Tip de uso: fórmula para acortar la descripción del producto.
Si tus productos suelen tener una descripción muy extensa y quieres acortarla en tu diseño, utiliza esta fórmula en el bloque de texto:
@truncate(; 80) - Donde 80 es la cantidad de caracteres
También puedes aplicar la misma fórmula para acortar el nombre del producto:
@truncate(; 80) - Donde 80 es la cantidad de caracteres