Barra de envío gratis para tienda en línea
Define el monto del envío gratis y prueba con el control de total del carrito. La barra se llena y el mensaje cambia cuando el cliente llega.
Cómo usarFaltan R$ 30 para el envío gratis
Disponible en: 
Barra de envío gratis para tienda en línea: para qué sirve
La barra de envío gratis muestra al cliente cuánto falta para obtener el envío gratis, y eso lo incentiva a agregar un artículo más al carrito en lugar de desistir por el costo del envío. Define el monto mínimo, el mensaje mientras falta (con el valor en reales en lugar de {valor}) y el mensaje al alcanzarlo.
El código crea la función freteGratis(total), que llamas cada vez que cambie el total del carrito. La barra usa el elemento progress y el mensaje se anuncia a los lectores de pantalla. Prueba con el control de total en la propia página.
Cómo usar
- Define el monto del envío gratis.
- Escribe los mensajes y elige el color.
- Copia el código y llama a freteGratis(total) en el carrito.
Cuándo usar
- Carrito de tienda en línea.
- Parte superior de la página de productos.
- Página de checkout.
Preguntas frecuentes
¿La barra de envío gratis aumenta las ventas?
Muestra cuánto falta para obtener el beneficio, lo que incentiva al cliente a agregar un artículo más en lugar de abandonar el carrito por el costo del envío. Funciona mejor cuando el monto mínimo queda un poco por encima del ticket promedio de la tienda.
¿Cómo conecto la barra a mi carrito?
El código crea la función freteGratis(total). Llama a esa función cada vez que cambie el total del carrito, por ejemplo freteGratis(87.5), y la barra y el mensaje se actualizan. En plataformas ya hechas, coloca la llamada en el evento de actualización del carrito.
¿Es accesible?
Sí. La barra usa el elemento progress, que los lectores de pantalla entienden, y el mensaje queda en una región aria-live que se anuncia cuando cambia.