Casos de uso de la banda decorativa – ZenBlocks buttonBasic

Casos de uso de la banda decorativa – ZenBlocks buttonBasic

Conclusion

La banda decorativa permite agregar **una cinta diagonal** al boton para destacar etiquetas cortas como `SALE`, `NEW`, `Recomendado` o `Limitado`.

Que es la banda

Es una cinta diagonal superpuesta en una esquina del boton que funciona como etiqueta visual.

### Caracteristicas

– Disponible en las 4 esquinas
– Presentacion diagonal
– Color de fondo y texto independientes
– Independiente del texto/icono principal
– Ajustable por dispositivo

Casos de uso

### Caso 1: promociones

– Texto: `SALE`, `-50%`, `Oferta limitada`
– Posicion: arriba izquierda o derecha
– Color: fuerte + texto claro

### Caso 2: novedad/recomendacion

– Texto: `NEW`, `Recomendado`, `Popular`
– Posicion: arriba derecha

### Caso 3: urgencia/escasez

– Texto: `Solo 3 plazas`, `J-2`
– Posicion: arriba izquierda

### Caso 4: estado

– Texto: `FREE`, `PRO`, `Beta`
– Posicion: arriba derecha

Configuracion

1. Abre panel de banda.
2. Escribe texto corto (2-6 caracteres recomendado).
3. Elige posicion.
4. Ajusta colores.
5. Ajusta tamano de fuente.
6. Verifica en front-end.

Puntos de atencion

– Texto largo rompe la diagonal.
– Revisa equilibrio con border-radius alto.
– En movil reduce tamano de banda si es necesario.

Ajustes relacionados

– [Configuración de banda](../band/)
– [Configuración de estilo](../style/)
– [Configuración de diseño](../layout/)

Related FAQ