¿Necesitas personalizar tu página de carrito de WooCommerce?
El diseño predeterminado de la página de carrito de WooCommerce a menudo resulta torpe y hace poco para animar a los clientes a completar su compra. Una página de carrito bien diseñada puede mejorar la experiencia del usuario, reducir el abandono del carrito y aumentar tus ventas.
En este tutorial, te mostraré paso a paso cómo personalizar tu página de carrito de WooCommerce sin escribir una sola línea de código. Usaremos SeedProd, el constructor de páginas de arrastrar y soltar en el que confío para crear páginas de WooCommerce de alta conversión en minutos.
Pasos rápidos para personalizar tu página de carrito de WooCommerce:
¿Por qué crear una página de carrito de WooCommerce personalizada?
¿Sabías que casi el 70% de los clientes abandonan su carrito de la compra antes de completar el pago? El abandono del carrito de la compra cuesta a las tiendas en línea miles de millones en ventas perdidas cada año.
Al tomarte el tiempo para personalizar el diseño de tu página de carrito de WooCommerce, puedes solucionar muchas de las razones por las que los clientes se van. Un mejor diseño puede generar confianza, resaltar ofertas clave y guiar a los compradores al botón de pago en lugar del botón de retroceso.
Cuando editas tu página de carrito de WooCommerce para mejorar la experiencia del usuario, aprovechas al máximo el tráfico que ya tienes. Incluso las pequeñas mejoras pueden reducir drásticamente las tasas de abandono y aumentar los ingresos sin gastar más en publicidad.
Aquí tienes algunas formas de optimizar tu carrito de WooCommerce para conversiones:
- Ofrece envío gratuito o muestra lo cerca que están los clientes de calificar para él
- Aplica descuentos automáticos o muestra los campos de códigos de cupón claramente
- Haz que los totales del carrito sean fáciles de leer y entender
- Añade señales de confianza como testimonios, reseñas o insignias de seguridad
- Utiliza un botón de actualizar carrito y asegúrate de que sea fácil de encontrar en dispositivos móviles
En general, un diseño de página de carrito de WooCommerce personalizado ayuda a los clientes a sentirse seguros al pagar y, en última instancia, genera más ventas para tu tienda.
Entonces, ¿cómo personalizas las páginas de carrito de WooCommerce? Vamos a sumergirnos y descubrirlo.
Cómo personalizar la página de carrito de WooCommerce
Mucha gente usa plugins de carrito de compras para optimizar las páginas de carrito en WooCommerce. Pero creemos que la forma más fácil de personalizar tu carrito es con un constructor de páginas de arrastrar y soltar como SeedProd.
SeedProd es el mejor constructor de páginas de WordPress con soporte para sitios web de WooCommerce. Puedes usar este plugin para crear una página de carrito de WooCommerce personalizada sin escribir código.
SeedProd ofrece más de 150 plantillas de páginas de destino totalmente responsivas para empezar rápidamente. Y con el editor visual, puedes personalizar tu página y ver los cambios en tiempo real.
Además, con toneladas de bloques y secciones, puedes hacer que tu página de carrito se vea exactamente como quieres sin contratar a un desarrollador.
Actualización: Ahora puedes crear un tema de WooCommerce personalizado con SeedProd, lo que te permite crear cualquier página de WooCommerce fácilmente sin código.
Teniendo esto en cuenta, sigue estos pasos para crear una página de carrito de WooCommerce personalizada con SeedProd.
Paso 1. Instalar y Activar SeedProd
El primer paso es descargar una copia del plugin de páginas de destino de WordPress SeedProd.
Luego, instala y activa el plugin en tu sitio web de WordPress. Para obtener ayuda con este paso, consulta esta guía detallada sobre cómo instalar un plugin de WordPress.
Nota: existe una versión gratuita de SeedProd que puedes usar. Pero para este tutorial, usaremos la versión Elite por la compatibilidad integrada con WooCommerce que necesitamos.
Después de activar SeedProd en tu sitio de WordPress, ve a SeedProd » Ajustes e introduce tu clave de licencia de producto.
Puedes encontrar tu clave de licencia de SeedProd en el panel de tu cuenta en el sitio web de SeedProd.
Paso 2. Crea una nueva plantilla de página de carrito de WooCommerce
Después de activar tu clave de licencia, ve a SeedProd » Páginas y haz clic en el botón 'Añadir nueva página de destino' para crear tu página de carrito.
Desde allí, puedes elegir una plantilla de página de carrito para usar como marco para tu diseño.
SeedProd ofrece cientos de plantillas adaptables a móviles para diversas industrias, muchas de las cuales puedes usar como plantillas de WooCommerce. Así que, cuando encuentres una plantilla que te guste, pasa el cursor sobre ella y haz clic en el icono de 'Marca de verificación' para lanzarla.
Para esta guía, usaremos la 'Plantilla en blanco'. Esta plantilla te permite empezar desde cero y solo añadir las secciones y bloques que desees.
Después de elegir tu plantilla, se abre una ventana emergente para añadir un nombre y una URL a tu página. Luego, puedes hacer clic en el botón 'Guardar y empezar a editar la página' para abrir la plantilla en el editor visual de SeedProd.
Paso 3. Personalizar el diseño y la apariencia de la página de carrito
El constructor de páginas de arrastrar y soltar de SeedProd tiene un diseño distintivo de 2 columnas que facilita su uso:
- A la izquierda se encuentran los bloques y secciones para personalizar tu diseño
- A la derecha hay una vista previa en vivo de tu página
Añadir contenido a tu página de carrito es tan sencillo como arrastrar un bloque desde la izquierda a tu vista previa de la derecha.
Veamos algunos de los elementos esenciales que puedes incluir en tu página de carrito de WooCommerce.
Añadir un logotipo
Para añadir un logotipo a tu página de carrito, elige una disposición de sección que albergue los elementos de tu página, como la sección estándar.
A continuación, elige el bloque 'Imagen' y arrástralo a tu nueva sección de la derecha.
Al hacer clic en el bloque de imagen, se abre el panel de configuración de contenido, donde puedes subir un logotipo desde tu ordenador o la biblioteca de medios de WordPress.
Desde allí, puedes añadir un enlace a tu página de inicio, redimensionar tu logotipo y cambiar la alineación.
Añadir un carrito de WooCommerce
Ahora añadamos tu carrito de compras de WooCommerce al diseño. Para ello, añade una nueva sección a tu diseño y elige la disposición de contenido con barra lateral.
Esta disposición te permite añadir tu carrito a la columna más grande y deja espacio en la columna más pequeña para reseñas, testimonios y otra información importante.
Para añadir tu carrito de WooCommerce a la página, desplázate hacia abajo hasta la sección de bloques de WooCommerce y arrastra el bloque 'Carrito' a tu nueva sección.
Al hacer clic en el icono de configuración del carrito se muestra un panel con ajustes de personalización de color, fuente y tamaño para:
- Encabezados
- Botones
- Campos
- Alerta
- Carrito
Por ejemplo, cambiamos los colores de los botones para que se alinearan mejor con la marca y el logotipo de nuestra tienda.
Añadir Reseñas y Testimonios
¿Recuerdas esa segunda columna? Para esta guía, usaremos esa columna para mostrar testimonios de clientes y valoraciones de estrellas.
La prueba social como esta puede animar a los compradores que están a punto de finalizar la compra a completar la venta. Después de todo, las opiniones positivas de clientes reales son mucho más convincentes que confiar en la palabra de una marca.
Para añadir testimonios a tu página de carrito de WooCommerce, busca el bloque Testimonios en la sección de bloques 'Avanzados' y arrástralo a tu columna estrecha de la derecha.
Y como todos los bloques de SeedProd, al hacer clic en él se muestran los ajustes para personalizar el contenido de tu testimonio. Por ejemplo, puedes añadir una foto de perfil personalizada, el nombre del cliente, cambiar la alineación e incluso añadir varias reseñas en un carrusel de testimonios.
Para que tus reseñas sean aún más convincentes, puedes arrastrar el bloque Valoración de Estrellas y colocarlo debajo de tu carrusel de testimonios.
Añadir Escasez y Urgencia
Una de las mejores maneras de atraer a clientes potenciales a tu pago de WooCommerce es crear una sensación de urgencia. Así, si los compradores no actúan ahora, pueden perderse una oferta emocionante.
La forma más fácil de añadir escasez a tu página de carrito de WooCommerce es con un temporizador de escasez o un reloj de cuenta atrás. Y SeedProd tiene esa opción incorporada.
Todo lo que necesitas hacer es seleccionar el bloque 'Temporizador de Cuenta Atrás' de la sección de bloques 'Avanzados' y arrastrarlo a la parte superior de tu carrito. Luego, selecciona la opción 'Temporizador de Visitante' para que el temporizador se actualice para cada visitante.
Luego, en la pestaña de ajustes Avanzados, puedes personalizar los colores para que coincidan con el resto de tu carrito.
Ahora añadamos un encabezado que indique a la gente que tiene un tiempo limitado hasta que su carrito expire. Para ello, arrastra el bloque 'Encabezado' e introduce tu texto.
Venta Cruzada de Productos de WooCommerce
Tu página de carrito de WooCommerce es un lugar excelente para promocionar y recomendar otros productos o servicios. De esa manera, puedes captar a los compradores antes de que finalicen la compra con productos relevantes que les puedan gustar.
Y la buena noticia es que SeedProd ofrece varias rejillas de productos diferentes que te permiten mostrar productos en cualquier página. Puedes encontrarlas yendo a la sección de bloques 'WooCommerce' y eligiendo entre:
- Productos recientes
- Productos en oferta
- Productos más vendidos
- Productos destacados
- Productos mejor valorados
Por ejemplo, puedes arrastrar el bloque 'Productos en Oferta' y añadirlo justo debajo de tu carrito de WooCommerce. De esa manera, los compradores tienen la oportunidad de añadirlos a sus carritos antes de finalizar la compra.
Paso 4. Publicar y Enlazar tu Nueva Página de Carrito
Después de realizar cambios en tu página de carrito, es hora de publicarla y ponerla en vivo en tu tienda de WooCommerce. Para hacerlo, haz clic en la flecha desplegable junto al botón verde Guardar y selecciona Publicar.
Luego, la tarea final es ajustar la URL de tu carrito en la configuración del plugin WooCommerce. Así que navega a WooCommerce » Ajustes y haz clic en la pestaña Avanzado.
Luego, junto al encabezado 'Página de carrito', selecciona la nueva página de carrito que creaste con SeedProd. Recuerda hacer clic en el botón Guardar Cambios en la parte inferior de la pantalla.
Ahora, cuando los compradores hagan clic en el enlace "Ver carrito" en tu sitio web, verán tu nueva página de carrito personalizada de WooCommerce.
Preguntas frecuentes sobre la personalización de la página de carrito de WooCommerce
Personalizar tu página de carrito de WooCommerce es una de las formas más rápidas de reducir el abandono del carrito y aumentar las ventas. Al mejorar el diseño, agregar señales de confianza y eliminar fricciones, puedes convertir a más compradores en clientes de pago.
Con SeedProd, puedes editar el diseño de tu página de carrito de WooCommerce sin tocar una sola línea de código. Su constructor de arrastrar y soltar facilita la creación de una página de carrito totalmente de marca y optimizada para conversiones.
Si deseas realizar un seguimiento de las conversiones de tu carrito de WooCommerce, consulta nuestra publicación sobre cómo configurar el seguimiento de conversiones de WooCommerce y esta guía sobre cómo solucionar problemas de la página 'Ver carrito' de WooCommerce.
Gracias por leernos. Por favor, síguenos en YouTube, Twitter y Facebook para más contenido útil para hacer crecer tu negocio si te ha gustado este artículo.
