Configuración email abandono de carrito

Modificado el Lun, 19 May a 10:34 A. M.

Este tipo de e-mail sirve como herramienta para aumentar la conversión, y que el cliente que ha abandonado el proceso de reserva en checkout, acabe finalizando la reserva.


Esta Herramienta es configurable para quienes tienen contratado Loyalty/Fidelización.


Para poder utilizar este tipo de emails, se deben seguir los siguientes pasos:

  1. Contactar con soporte Witbooking para solicitar esta funcionalidad y recibir el contrato de exoneración de carrito.
  2. Devolver firmado a Witbooking el contrato de exoneración de carrito. Activaremos dicha funcionalidad, una vez recibamos el contrato firmado.
  3. Maquetar la plantilla del e-mail.
  4. Acceder desde backoffice del motor a COMUNICACIÓN > Emails Personalizados > Crear Nuevo.
  5. Configurar la plantilla 
  6. Hacer una prueba para confirmar que se ha creado correctamente.


COMO MAQUETAR LA PLANTILLA DEL E-MAIL

A continuación encontrará las etiquetas que se pueden utilizar y que se reemplazarán por los valores de cada reserva: 

  • Customer

    • Nombre →  customer.name 

    • Apellido →  customer.lastName

    • Dirección → customer.address

    • Número de teléfono →  customer.phoneNumber

    • Email →  customer.email

    • idCard →  customer.idCard

    • Country →  customer.country 

    • Tier (nivel loyalty) →  customer.tier

  • Client Sessión ID → Se puede utilizar, pero no tiene gran utilidad de cara al cliente.

  • urlSession → esta etiqueta es la que debe implementarse en el botón para redirigir al check-out con el carrito abandonado.

 

Nota importante: las variables marcadas con HTML tienen contenido HTML, en este caso, para renderizarlas han de utilizar tres llaves {{{    }}}.  Ejemplo: {{{conditionInfo.checkOut}}} 


Para probar como se ven los estilos de las plantillas cuando se envían por email puede utilizar el siguiente enlace: https://putsmail.com/tests/new 



Ejemplo de uso:


Ejemplo plantilla HTML: 
(los estilos son los del ejemplo de uso)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <style type="text/css"> ReadMsgBody{width: 100%;}.ExternalClass{width: 100%;}.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div{line-height: 100%;}body{-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;margin:0 !important;}p{margin: 1em 0;}table td{border-collapse: collapse;}img{outline:0;}a img{border:none;}@-ms-viewport{width: device-width;}</style> <style type="text/css"> @media only screen and (max-width: 480px){.container{width: 100% !important;}.footer{width:auto !important; margin-left:0;}.mobile-hidden{display:none !important;}.logo{display:block !important; padding:0 !important;}img{max-width:100% !important; height:auto !important; max-height:auto !important;}.header img{max-width:100% !important;height:auto !important; max-height:auto !important;}.photo img{width:100% !important; max-width:100% !important; height:auto !important;}.drop{display:block !important; width: 100% !important; float:left; clear:both;}.footerlogo{display:block !important; width: 100% !important; padding-top:15px; float:left; clear:both;}.nav4, .nav5, .nav6{display: none !important;}.tableBlock{width:100% !important;}.responsive-td{width:100% !important; display:block !important; padding:0 !important;}.fluid, .fluid-centered{width: 100% !important; max-width: 100% !important;height: auto !important; margin-left: auto !important;margin-right: auto !important;}.fluid-centered{margin-left: auto !important;margin-right: auto !important;}/* MOBILE GLOBAL STYLES - DO NOT CHANGE */ body, .tb_properties{font-family: Arial !important; font-size: 16px !important; color: #000000 !important; line-height: 1.5 !important; padding: 0px !important;}.buttonstyles{font-family: Arial, helvetica, sans-serif !important; font-size: 16px !important; color: #000000 !important; padding: 10px !important;}h1{font-family: Arial !important; font-size: 22px !important; color: #202020 !important; line-height: 1 !important;}h2{font-family: Arial !important; font-size: 20px !important; color: #202020 !important; line-height: 1 !important;}h3{font-family: Arial !important; font-size: 18px !important; color: #202020 !important; line-height: 1 !important;}a:not(.buttonstyles){line-height: 1 !important; border-radius: 10px;}.mobile-hidden{display: none !important;}.responsive-td{width: 100% !important; display: block !important; padding: 0 !important;}/* END OF MOBILE GLOBAL STYLES - DO NOT CHANGE */}@media only screen and (max-width: 640px){.container{width:100% !important;}.mobile-hidden{display:none !important;}.logo{display:block !important; padding:0 !important;}.photo img{width:100% !important; height:auto !important;}.nav5, .nav6{display: none !important;}.fluid, .fluid-centered{width: 100% !important;max-width: 100% !important;height: auto !important; margin-left: auto !important; margin-right: auto !important;}.fluid-centered{margin-left: auto !important;margin-right: auto !important;}}</style> </head> <body bgcolor="#F3EFE7" text="#000000" style="-webkit-text-size-adjust:none;background-color : #F3EFE7; font-family : Arial, helvetica, sans-serif; line-height : 100%; font-size : 16px; color : #000000; padding : 0px; "> <div style="font-size:0; line-height:0;"> <custom name="opencounter" type="tracking"> <custom name="usermatch" type="tracking"/> </div><table width="100%" border="0" cellpadding="0" cellspacing="0" align="center"> <tr><td align="center" valign="top"> <custom type="header"/></td></tr><tr><td align="center"> <table cellspacing="0" cellpadding="0" border="0" width="600" class="container" align="center"><tr><td><table class="tb_properties border_style" style="font-size : 16px; font-family : Arial, helvetica, sans-serif; color : #000000;background-color : transparent; border : 0px solid transparent; line-height : 100%; " cellspacing="0" cellpadding="0" bgcolor="transparent" width="100%"> <tr><td align="center" valign="top"><table align="left" border="0" cellpadding="0" cellspacing="0" width="100%"><tr> <td class="content_padding" style="padding : 0px 0px 0px 0px; "> <table border="0" cellpadding="0" cellspacing="0" width="100%"><tr> <td align="center" class="header" valign="top"><table align="left" border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr> <td align="left" valign="top"><table cellspacing="0" cellpadding="0" style="width:100%"> <tbody><tr><td class="responsive-td" valign="top" style="width: 100%;"><table cellpadding="0" cellspacing="0" width="100%" role="presentation" style="background-color: #234739; min-width: 100%; " class="stylingblock-content-wrapper"><tr><td style="padding: 0px; " class="stylingblock-content-wrapper camarker-inner"><table cellspacing="0" cellpadding="0" role="presentation" style="width: 100%;"><tr><td><table cellspacing="0" cellpadding="0" role="presentation" style="width: 100%;"><tr><td valign="top" style="width: 50%; padding-right: 0px;"><table cellpadding="0" cellspacing="0" width="100%" role="presentation" style="background-color: #234739; min-width: 100%; " class="stylingblock-content-wrapper"><tr><td style="padding: 0px; " class="stylingblock-content-wrapper camarker-inner"><div style="line-height: 200%;"> <b><span style="font-size:12px;"><span style="font-family:Arial,Helvetica,sans-serif; color: #F3EFE7;"> RESERVAS: +34 921 920 300</span></span></b></div></td></tr></table></td><td valign="top" style="width: 50%; padding-left: 0px;"><table cellpadding="0" cellspacing="0" width="100%" role="presentation" style="background-color: #234739; min-width: 100%; " class="stylingblock-content-wrapper"><tr><td style="padding: 0px; " class="stylingblock-content-wrapper camarker-inner"><div dir="rtl" style="line-height: 200%;"> <span style="font-size:12px;"><span style="font-family:Arial,Helvetica,sans-serif;"> </span></span><b><span style="font-size:12px;"><u></span> <a target="_blank" class="buttonstyles" style="font-family:Arial,Helvetica,sans-serif;color: #F3EFE7"href="https://direct.witbooking.com/hotel/demo_urbano" title="" alias="" conversion="false" data-linkto="other">BUSCAR DISPONIBILIDAD</a></u></span></b></div></td></tr></table></td></tr></table></td></tr></table></td></tr></table><table cellpadding="0" cellspacing="0" width="100%" role="presentation" style="min-width: 100%; " class="stylingblock-content-wrapper"><tr><td class="stylingblock-content-wrapper camarker-inner"><table width="100%" cellspacing="0" cellpadding="0" role="presentation"><tr><td align="center"><img data-assetid="130495" src="https://www.smarttravel.news/wp-content/uploads/2022/11/Witbooking_Logo_verde.png" alt="" width="600" style="display: block; padding: 0px; text-align: center; height: auto; width: 50%; border: 0px;"></td></tr></table></td></tr></table><table cellpadding="0" cellspacing="0" width="100%" role="presentation" style="min-width: 100%; " class="stylingblock-content-wrapper"><tr><td class="stylingblock-content-wrapper camarker-inner"><table width="100%" cellspacing="0" cellpadding="0" role="presentation"><tr><td align="center"><img data-assetid="195424" src="https://s3.amazonaws.com/shecodesio-production/uploads/files/000/104/779/original/93dc4afd-b0c3-47d8-b01e-c9574d2fb542.jpg?1700742692" alt="" width="600" style="display: block; padding: 0px; text-align: center; height: auto; width: 100%; border: 0px; border-radius: 10px;"></td></tr></table></td></tr></table><table cellpadding="0" cellspacing="0" width="100%" role="presentation" style="min-width: 100%; " class="stylingblock-content-wrapper"><tr><td class="stylingblock-content-wrapper camarker-inner"><table cellspacing="0" cellpadding="0" role="presentation" style="width: 100%;"><tr><td><table cellspacing="0" cellpadding="0" role="presentation" style="width: 100%;"><tr><td valign="top" class="responsive-td" style="width: 100%;"><table cellpadding="0" cellspacing="0" width="100%" role="presentation" style="background-color: #F3EFE7; min-width: 100%; " class="stylingblock-content-wrapper"><tr><td style="padding: 30px 30px 20px; " class="stylingblock-content-wrapper camarker-inner"><div style="text-align: center; line-height: 150%;"> <span style="font-size:22px;"><b>Hola! {{{customer.name}}}{{{customer.lastName}}}, conserva tu nivel {{{customer.tier}}}</b><b> y no pierdas tu reserva!</b> <br><br>No te preocupes, te la guardamos un rato ;)<span></div></td></tr></table></td></tr></table></td></tr></table></td></tr></table><table cellpadding="0" cellspacing="0" width="100%" role="presentation" style="background-color: #F3EFE7; min-width: 100%; " class="stylingblock-content-wrapper"><tr><td style="padding: 10px 0px; " class="stylingblock-content-wrapper camarker-inner"><table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation"><tr><td align="center"><table border="0" cellspacing="0" cellpadding="0" role="presentation"><tr><td class="innertd buttonblock" bgcolor="#D8FF02" style=" border-radius: 5px!important; -moz-border-radius: 0px; -webkit-border-radius: 0px; color: transparent; background-color: #234739;"><a style=" font-size: 16px; font-weight: bold; font-family: Arial, helvetica, sans-serif; color: #F3EFE7; text-align: center; text-decoration: none; display: block; line-height: 100%; background-color: #234739; border: 1px solid transparent; padding: 10px; border-radius: 10px!important; -moz-border-radius: 0px; -webkit-border-radius: 0px;" target="_blank" class="buttonstyles" href="{{{urlSession}}}" title="" alias="" conversion="false" data-linkto="other">VOLVER A LA RESERVA</a></td></tr></table></td></tr></table></td></tr></table> </body> </html>


COMO PROBAR LA PLANTILLA PERSONALIZADA:


Durante el desarrollo del mail personalizado se puede validar la programación del archivo JSON en el siguiente sitio web: https://pismute.github.io/Try-Dashbars/


Una vez en la interfaz se pegará la maquetación del mail personalizado en el apartado de "Handlebars Template".


COMO CONFIGURAR LA PLANTILLA DEL E-MAIL:

Para configurar su plantilla, debe seguir los siguientes pasos:

  1. Acceder desde backoffice del motor a COMUNICACIÓN > Emails Personalizados > Crear Nuevo.
    • Activo: el checkbox debe estar activo.
    • Tipo Email: Abandono de carrito
    • Demora: escoger el tiempo, según preferencia.
    • Destinatario del email:
      • Todos: la plantilla se envía tanto al establecimiento como al huésped.
      • Huéspedes: la plantilla se envía únicamente al posible huésped
      • Establecimiento: la plantilla se envía únicamente al establecimiento.
    • Traducciones
      • Asunto: borrar el contenido default e introducir el asunto personalizado, según preferencias, en todos los idiomas activos.
      • Cuerpo: introducir la plantilla personalizada que se haya maquetado, en todos los idiomas activos. 
    • Guardar.
  2. Hacer una prueba para confirmar que se ha creado correctamente.



¿Le ha sido útil este artículo?

¡Qué bien!

Gracias por sus comentarios

¡Sentimos mucho no haber sido de ayuda!

Gracias por sus comentarios

¡Háganos saber cómo podemos mejorar este artículo!

Seleccione al menos una de las razones
Se requiere la verificación del CAPTCHA.

Sus comentarios se han enviado

Agradecemos su esfuerzo e intentaremos corregir el artículo