El bloque Empty cart es el contenido que se muestra cuando el carrito no tiene artículos, típicamente un mensaje y un botón de seguir comprando, para que un drawer vacío siga siendo útil y acorde a la marca. Solo aparece en el estado vacío del carrito; otros bloques (como el Header) pueden acompañarlo en ese mismo estado.
Comportamiento
- El bloque aparece solo cuando el carrito está vacío. En cuanto un comprador agrega un artículo, el carrito cambia a su estado con artículos y este bloque es reemplazado por tu layout de carrito lleno.
- En el editor, el enlace del CTA está inactivo, así que hacer clic en él no te lleva a otra página mientras diseñas.
Configuraciones
Ubicación y límites
- Región: cuerpo.
- Máximo: 1 por estado del carrito.
- Estado: solo carrito vacío. Este bloque no aparece en el estado con artículos. Los carritos nuevos también incluyen un Header en el estado vacío de forma predeterminada; consulta ¿Cómo funcionan los carritos?.
- Se agrega a los carritos nuevos de forma predeterminada. No está bloqueado — puedes eliminarlo u ocultarlo.
Plantilla personalizada
Este bloque solo se renderiza cuando el carrito está vacío, así que no hay un objeto cart en las props. Renderiza
href como un <a> real en lugar de una navegación con script, y text con dangerouslySetInnerHTML, ya que es HTML ya sanitizado.Diseño
Text
Button label — el texto del botón de seguir comprando. El color del texto se establece en la sección Button de Design.
La sección Button te permite dar estilo al botón de llamada a la acción de forma independiente del diseño global de botones. Usa el interruptor Default / Hover para alternar entre los dos estados.
¿Qué son las configuraciones de diseño? Aprende más aquí: Configuraciones de diseño.