Nada es más importante en una tienda online que el proceso de pago.
La facilidad con que se produzca el checkout, es decir el proceso de compra y salida de la misma, va a tener un influjo directo en las conversiones de tu tienda. Facilitar el pago debe ser la primera misión que pongas en marcha si quieres mejorar tus resultados.
Una de las fórmulas que más ayuda en Prestashop es tener el típico módulo One Page Checkout, es decir, uno que permita que el proceso de compra se pueda realizar en una única página.
Según un estudio de 2015, tener está fórmula puede incrementar tus ventas hasta un 36%.
Si, además, tenemos un formulario de registro sencillo como el Social Login, que permite darte de alta a través de tus redes sociales y te regalamos con nuestro módulo Easy Checkout, el porcentaje aumenta en un 16% más.
Sumando ambos, podemos incrementar las conversiones hasta en un 52%, un porcentaje nada desdeñable.
Módulo One Page Checkout vs Easy Checkout
En Prestashop, una de las herramientas más utilizadas para facilitar la venta es el módulo One Page Checkout.
Sin embargo, en el campo de la optimización de conversiones (a nivel de psicología de ventas, sobre todo), este módulo tiene algunas carencias clave que hemos visto necesario mejorar. En Érase una venta nos pusimos manos a la obra y creamos nuestro propio módulo tipo one page, mucho más amigable de cara a la conversión final en venta: el Easy Checkout.
Aunque el módulo One Page Checkout es muy completo, limpio y lleno de funcionalidades tiene un «fallo» muy importante. Un requisito previo que echa atrás a un porcentaje de potenciales clientes: el aspecto visual. Sigue pareciendo «demasiado formulario».
La primera impresión con one page checkout es que tiene demasiados campos a rellenar. La primera sensación con tantos campos llenando la página puede producir (y produce en algunos compradores) AGOBIO, haciendo que el usuario termine por abandonar el carrito antes de finalizar su compra.
[blockquote text=»Con el Easy Checkout, sin embargo, evitamos la sensación de saturación, marcando intuitivamente sólo tres bloques -o dos si no necesitamos transportista- en sendas columnas bien estructurados y muy cómodos de rellenar para que el checkout sea lo más agradable y rápido posible.» text_color=»#2e2e2e» width=»90″ line_height=»undefined» background_color=»#f5f5f5″ border_color=»#ffd633″ show_quote_icon=»no» quote_icon_color=»»]
[button size=’big_large’ style=» text=’Descárgalo Aquí’ icon=’fa-download’ icon_color=» link=’http://landingmaxconversions.com/es/modulos-max-conversions/19-easy-checkout-social-login.html’ target=’_blank’ color=» hover_color=» border_color=» hover_border_color=» background_color=’#ffa200′ hover_background_color=» font_style=» font_weight=’600′ text_align=’center’ margin=»]
Sobre la actualización del módulo de Checkout para PrestaShop 1.7, mira este artículo.
Un Tour por el módulo Easy Checkout
Para empezar, te dejo este tutorial que ha hecho Dan en Youtube para que veas cómo configurarlo si prefieres que te lo expliquen en vídeo.
Recuerda que puedes utilizar la demo para hacer tus pruebas de forma gratuita y comprobar por ti mismo cuál es el resultado final.
Para usar la demo, haz click aquí para el front y aquí para el backoffice.
Usuario: demo@demo Contraseña: demodemo
Y ahora voy a explicarte como conseguir minimizar los abandonos del carrito en unos pocos pasos.
1. Configuración genérica del módulo
Una vez dentro, del mismo el primer campo a rellenar es la configuración genérica del módulo, que viene con tres opciones diferentes. En la primera tendrás que elegir si quieres mostrar el transportista en el carrito.
Puedes no hacerlo por varias razones:
- la primera es que solo trabajes con una empresa de transporte y no ofrezcas la posibilidad de elegir entre diferentes tipos de envío. En ese caso lo mejor es quitarlo de la página de pago ya que solo supone ocupar un espacio innecesario. Es importante tener siempre claro que cuánto menos campos que rellenar más facilidad de pago y menos abandono del carrito.
- La segunda es que vendas productos o servicios digitales y, por tanto, no vayas a enviar nada de manera física. De esta forma, tu página checkout pasará de tener tres columnas a sólo dos. Te lo muestro al final del post.
El siguiente punto te permite activar o desactivar la compra con cuenta de invitado. Esta es una cuestión exclusivamente personal aunque, de nuevo, si damos esa posibilidad es probable que aumentemos el porcentaje de conversiones finales.
Por último, tienes a tu disposición la un campo para estilo personalizado en CCS. En principio no es necesario usarlo para nada y puedes dejar tu página completamente profesional sin hacer uso de la misma. Sin embargo, existen usuarios con conocimientos avanzados de CCS a los que les gusta hacer algunos pequeños cambios más allá de las opciones predeterminadas del módulo y que podrán hacerlo con esta hoja de estilo sin necesidad de tocar el archivo del mismo en Prestashop.
2. Campos opcionales en el registro
El siguiente campo aparece desactivado por defecto. Uno a uno, puedes ir añadiendo los campos adicionales que necesites en el proceso de compra. De nuevo, si lo que quieres es optimizar las conversiones mi recomendación es que los dejes todos desactivados, a excepción de aquellos que sean realmente imprescindibles.
Los dejamos porque existen empresas que debido a su sector de actividad necesitan tener alguno de ellos y porque, al final, la decisión siempre corresponde al propio ecommerce.
De todas formas, se pongan o no estos campos opcionales el resultado es muy amigable a la vista, al estar oculto hasta que se pulsa sobre el botón para loguearte, evitando así la saturación que produce el módulo One Page Checkout.
Cuántos menos campos haya que rellenar, más rápido será y más satisfecho se irá el usuario, favoreciendo que nos recomiende o vuelva a hacer otra compra.
3. Estilos apartado de login/ registro
Los siguientes campos están preparados para personalizar el estilo de tu página de Easy Checkout.
En este primer apartado se puede elegir el estilo del primer bloque. Aunque cada bloque vaya por separado, es importante mantener una armonía entre todos y usar colores similares.
Una de las cosas que debemos decidir es si queremos poner un fondo o dejarlo en blanco, en cuyo caso no se distinguirán los bloques en el resultado final. Se puede elegir desde todos los colores, a la fuentes del texto entre todas de Google Fonts y las de Web Safe Fonts o el tamaño de la fuente, si queremos borde o separador o si optamos por el redondeo.
4. Estilos apartado de envíos
Lo mismo ocurre con la columna del transportista. Si no la has seleccionado en el primer campo, nada de lo que aquí pongas aparecerá en el resultado final, así que puedes obviarlo.
Aquí también puedes personalizar el cuadro del transportista y colocar los colores que veas más oportuno. Igualmente, puedes destacar el transportista que más te interese.
5. Estilos apartado de formas de pago
[highlight color=’#292929′ background_color=’#ffea00′]Los botones de la forma de pago son los más importantes del Easy Checkout ya que suponen el momento en el que el cliente terminará de adquirir el producto o servicio de tu ecommerce. Son el CTA que debe ser más intuitivo de todos.[/highlight] Por ello, se puede seleccionar el color al pasar el ratón para que haya un mayor contraste. También podemos seleccionar que método nos interesa destacar entre las distintas posibilidades.
Uno de los mayores atractivos de esta última columna es que aparece la posibilidad de introducir el cupón de descuento antes de los métodos de pago frente a lo habitual en Prestashop, que los colocaba por defecto en la parte inferior de la página y no es fácil de encontrar en muchas ocasiones.
Esta es una reivindicación habitual de los clientes de Érase una venta y hemos aprovechado nuestro módulo para poder incorporarlo.
6. Estilo general de botones
Por último y antes de guardar, se puede seleccionar el estilo general de los botones. Así se puede lograr de forma más rápida. Te enseño como quedaría si le ponemos fondo y si preferimos no separar las columnas.
Para esta nueva versión hemos seleccionado el blanco como color de fondo y de borde, consiguiendo eliminar la separación del formato y generando una mayor limpieza. Si tú también estás haciendo la prueba, no olvides borrar la caché de tu navegador para que te aparezcan los cambios realizados en la demo.
Y, para acabar, te mostramos cómo queda sin columna de transportista:
Recuerda que puedes cambiar el tipo de letra, el tamaño de los botones, etc… hasta ponerlo completamente a tu gusto.
De regalo: Social Login
En la optimización de conversiones, el social login tiene cada vez más importancia. Por ello, al comprar tu módulo Easy Checkout te regalamos nuestro módulo Social Login. Aunque en el ejemplo que te hemos puesto arriba solo aparece Facebook, Twitter y Google +, tienes a tu disposición para elegir también Instagram, LinkedIn, PayPal y Amazon.
Si te interesa conocer más de las ventajas del social login no puedes perderte este artículo de Dan. Y es que según un estudio de Janrain del año pasado, el 77% prefiere usar social login antes que una cuenta de invitado, un porcentaje que se ha incrementado desde el 40% que había en el año 2011. Sin duda, son datos para comenzar a planteárselo.
Ya sabes, aprovecha la oportunidad e incrementa tus ventas gracias al módulo Easy Checkout y disfruta del Social Login de regalo en el siguiente enlace. Recuerda que puedes probarlo en nuestra demo.
Usuario: demo@demo Contraseña: demodemo
[button size=’big_large’ style=» text=’Descárgalo Aquí’ icon=’fa-download’ icon_color=» link=’http://landingmaxconversions.com/es/modulos-max-conversions/19-easy-checkout-social-login.html’ target=’_blank’ color=» hover_color=» border_color=» hover_border_color=» background_color=’#ffa200′ hover_background_color=» font_style=» font_weight=’600′ text_align=’center’ margin=»]
Sobre la actualización del módulo de Checkout para PrestaShop 1.7, mira este artículo.
Recuerda: aplicando este método puedes aumentar en un 52% tus conversiones, o incluso más 😉
PERFECTO LA GENTE DEBE DE SABER QUE ESTE MODULO TAN INTELIGENTEMENTE PENSADO EXISTE…ES LO QUE ANDABA BUSCANDO…COMO HAGO PARA SUSTITUIR EL AREA DE PAGO QUE TENGO EN PRESTASHOP QUE CREO ES UN MODULO POR ESTE…….MI SITIO WEB: http://www.tourismmadeeasy.ca …agradeceria su ayuda