Cómo crear un mini carrito de WooCommerce 2024

Actualizado el 12 de enero de 2024

¿Está buscando una manera fácil de configurar un mini carrito de WooCommerce ? Si su experiencia de pago es lenta y repetitiva, puede afectar la experiencia de compra de su cliente. Mejorar el flujo de su proceso de pago es una parte integral de la mejora de sus conversiones de clientes potenciales y un mini carrito puede ser una gran solución para ello.
 

Entonces, para ayudarlo a agregar uno a su sitio web, aquí hay una guía sobre cómo crear un mini carrito de WooCommerce. Pero primero, echemos un vistazo a qué es exactamente un mini carrito y por qué es posible que necesite usar uno.

¿Qué es un mini carrito de WooCommerce?

Su carrito WooCommerce Mini es solo una pequeña forma de su página de carrito real de WordPress. Contiene los productos agregados a su carrito junto con algunos detalles más. El contenido del mini carrito depende de su tema de WordPress activo, pero generalmente incluye:

  • Tu lista de productos
  • Total parcial
  • Miniaturas de productos
  • Cantidad de producto

Independientemente de los detalles que muestre su mini carrito WooCommerce, es una parte crucial de la experiencia de usuario de su cliente mientras navega por su tienda WooCommerce. Es una herramienta accesible que sus clientes pueden usar para pasar a la página de pago directamente desde cualquier parte de su sitio web y ayuda a realizar un seguimiento de los artículos del carrito.

Incluso usamos el mini carro en QuadLayers . Si agrega un producto al carrito, puede ver el mini carrito al pasar el mouse sobre el ícono del carrito en el menú del encabezado.

Si observa la captura de pantalla a continuación, hemos agregado el producto WooCommerce Checkout Manager al carrito. Esto también se muestra en el mini carrito junto con la cantidad y el subtotal.

¿Por qué crear un Mini Cart para tu sitio web de WooCommerce?

De forma predeterminada, su tema de WooCommerce puede venir con su propio mini carrito de WooCommerce. E incluso si lo hace, es posible que su posición y estilo no se puedan personalizar completamente desde la configuración de su tema. Además, es posible que no esté en el lugar perfecto para su mini carrito.

Algunos de nuestros lectores podrían considerar agregar un mini carrito flotante, mientras que otros podrían agregarlo a la barra lateral o al pie de página. Existen varios enfoques posibles que quizás desee considerar usar. Además, es posible que también deba agregar más contenido, como precios de envío, detalles adicionales del carrito, mensajes personalizados y más.

La facilidad de la comodidad al usar su carrito también puede ser importante para que usted y sus clientes mejoren sus ventas reales . Un pago personalizado y listo para la venta que se adapte perfectamente a la estética de su sitio web puede cambiar las reglas del juego para su sitio web de WooCommerce. Entonces, si desea crear y agregar su mini carrito personalizado a diferentes páginas de su sitio web, ¡no busque más!

Cómo crear un mini carrito de WooCommerce en WordPress

Para crear y agregar su carrito WooCommerce Mini , puede usar 3 métodos diferentes :

  1. Agregar un widget de carrito
  2. Usar un plugin de WordPress
  3. Programáticamente

Echemos un vistazo a cada método y los pasos involucrados en todos ellos, comenzando con el método predeterminado de uso de widgets de WordPress.

1. Cree un minicarro de WooCommerce usando widgets de WordPress

De forma predeterminada, puede crear mini carritos de  WooCommerce utilizando el widget de carrito de WooCommerce. Dado que estamos usando un widget, se puede colocar solo en las áreas de widgets disponibles del tema. Las áreas más comunes incluyen:

  • Barra lateral de widgets
  • Debajo del encabezado
  • Pies de página

Puede haber más áreas de widgets dependiendo de su tema. Pero asegúrese de usar también uno de los temas compatibles con WooCommerce.

1.1. Seleccione el área de widgets

Para agregar un widget de carrito, primero deberá seleccionar un área de widgets. Así que abre tu panel de administración de WP y ve a Apariencia > Widgets . Luego, elige el área de widgets para su mini carrito.

Para nuestra demostración, usaremos la barra lateral . Pero puede usar el área de widgets que le resulte más conveniente.

crear mini carrito de woocommerce - página de widgets

1.2. Agregar widget de carrito al área de widgets

Después de seleccionar el área de widgets, haga clic en el botón + para agregar el widget. Use la barra de búsqueda para buscar Carrito y haga clic en él para agregar el widget .

Si no puede ver el widget, asegúrese de haber configurado correctamente WooCommerce en su sitio web.

Aquí, también puede habilitar o deshabilitar la opción Ocultar si el carrito está vacío . Le recomendamos que lo habilite porque su carrito de la barra lateral se ocultará si el carrito de su cliente está vacío. Esto también hará que su sitio web se vea más funcional.

crear mini carrito de woocommerce - captura de pantalla de carrito agregado

Una vez que termine de agregar el widget del carrito, actualice sus widgets para guardar los cambios. Ahora, su mini carrito de la barra lateral debería aparecer en su parte frontal.

Por supuesto, también puede agregar su mini carrito a un área de widgets diferente. Simplemente seleccione la ubicación debajo de la página de widgets y puede agregar fácilmente el widget debajo de su encabezado o en el pie de página.

crear mini carrito de woocommerce - carrito de encabezado

Si bien esta es la forma más fácil de crear su mini carrito de WooCommerce, viene con una buena cantidad de limitaciones . Por un lado, no hay personalizaciones, usted está muy limitado en términos de cómo se ve su mini carrito y cómo acceden sus clientes.

Las posiciones están limitadas a las áreas de widgets proporcionadas por su tema. Además, las características como los mini carritos emergentes o los campos personalizados del carrito tampoco están disponibles para los clientes o el propietario del sitio web. 

2. Cree un minicarro de WooCommerce usando un plugin de WordPress

El uso de un plugin de WordPress es una de las formas más fáciles de curar la experiencia de su carrito. Puede asegurarse de que sus clientes puedan pagar fácilmente en cualquier momento con la ayuda de plugins. También le permiten simplificar la experiencia de pago de su sitio web.

Los plugins brindan funciones ingeniosas para promover las ventas de sus productos y mejorar la generación de clientes potenciales. Por ejemplo:

  • Puede habilitar íconos de carro flotante y ventanas emergentes para que sus clientes puedan acceder a ellos en cualquier momento mientras mantienen el resto del contenido de la tienda limpio y sin distracciones.
  • Se pueden agregar muchos elementos de carrito y productos al mini carrito. Por ejemplo, información adicional del producto, cambiar la cantidad, editar el subtotal del carrito y la visualización del total, y mucho más.
  • Con los plugins, puede agregar algunas funciones inteligentes, como agregar cupones directamente, productos destacados dedicados y sugerencias de productos recomendados.

Para nuestra demostración, usaremos el plugin Woocommerce Cart All in One. Es uno de los mejores plugins para crear un mini carrito en su sitio web. El plugin también es muy fácil de usar y tiene todas las funciones que necesita, como una ventana emergente, un carrito de barra lateral o opciones de personalización de carrito de menú.

 

2.1. Instalar y activar el plugin

Comencemos instalando y activando el plugin.

Abra su Panel de administración de WP y luego vaya a Plugins> Agregar nuevo en su barra lateral.

Ahora, necesitamos configurar el plugin para habilitar su mini carrito de WooCommerce.

2.2. Configure el carrito todo en uno para el plugin WooCommerce

Para configurar el mini carrito WooCommerce del plugin, haga clic en la pestaña Carrito todo en uno en su Panel de administración de WP . Esto abrirá la página del Panel de control del plugin.

crear mini carrito de woocommerce - carrito todo en uno

En la versión gratuita del plugin, puede habilitar un mini carrito de barra lateral o un mini carrito de menú . También puede agregar y configurar un botón Agregar al carrito de AJAX, pero centrémonos solo en las opciones del mini carrito por ahora.

Para activar la ventana emergente del mini carrito en su sitio web, abra el carrito de la barra lateral y haga clic en Habilitar . También puede usar la opción Habilitar móvil para habilitar/deshabilitar la ventana emergente del mini carrito en los dispositivos móviles. Finalmente, guarde sus cambios.

Ahora, vaya y vuelva a cargar el front-end de su sitio web. Debería ver su nuevo ícono de mini carrito en su página web. Simplemente puede hacer clic en él para abrir su mini carrito.

Además, también puede agregar un carrito de menú a cualquiera de sus menús. Simplemente abra la pestaña Menú del carrito y habilítelo como en los pasos anteriores. También puede habilitarlo en los menús móviles si es necesario.

A continuación, debe agregar los menús de WordPress donde desea mostrar el carrito de menús en su sitio web. Simplemente elija los menús que le gustaría agregar a su mini carrito de WooCommerce en el campo Menús . Luego haga clic en Guardar .

Ahora debería ver su mini carrito de menú en su sitio web. Se añadirá a los menús que hayas seleccionado para el mini carrito.

2.3. Personaliza tu WooCommerce Mini Cart usando el plugin

La personalización es una característica clave con el plugin Cart All in One . Puede personalizar libremente su carrito de la barra lateral, así como el carrito del menú. Esto incluye colores, estilos, posiciones, animaciones personalizadas, íconos, estilos de menú de la barra lateral y mucho más.

Para acceder a las opciones de personalización, vaya a Apariencia > Personalizar en su panel de administración de WP. Será redirigido al personalizador de su tema. Aquí, haga clic en Carrito todo en uno para WooCommerce y debería ver todas las opciones de personalización.

crear mini carrito de woocommerce - personalización del carrito

Para esta demostración, personalizaremos el Sidebar Cart. Así que haga clic en  Sidecart Cart y debería ver todas las opciones para ello. Por ahora, habilitaremos un mini cart más pequeño usando la opción Mostrar contenido de la barra lateral y cambiaremos la posición del carrito de la barra lateral.

Pero puede personalizar aún más usando estas opciones dependiendo de cómo se adapte a su sitio web. Todavía hay mucho que editar, como la interacción con el ícono del carrito, por lo que el mini carrito aparece cuando pasa el mouse sobre el ícono, personaliza el ícono de carga y mucho más.

crear mini carrito de woocommerce - estilo de personalización del carrito

Una vez que haya terminado con sus cambios, haga clic en Publicar y guárdelos. 

Video Tutorial:

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Carrito de compra