Animated waves y Animated particles son franjas decorativas. Las olas crean un borde suave en movimiento entre dos secciones. Las partículas llenan una franja con formas que flotan lentamente, como nieve o burbujas.
Añadir una
En el constructor, abre la pestaña Sections, haz clic en Add new section y elige Animated waves o Animated particles en el grupo Decoration. Arrastra la franja entre las dos secciones que quieres separar. Puedes añadir hasta 5 de cada una por página, en cualquier página.
Animated waves
Olas
- Style: Gentle, Calm, Choppy, Peaks, Zigzag o Blob.
- Height: de 40 a 300 píxeles.
- Layers: de 1 a 4 olas superpuestas. Más capas dan más profundidad.
- Speed: Slow, Normal o Fast.
Diseño
- Merge with header: quita el fondo de la franja para que se vea como parte del encabezado que está encima. Coloca la franja justo debajo del encabezado para tener un encabezado con borde ondulado.
- Flip vertically: pone las olas boca abajo, para que se fundan con la sección de arriba en lugar de la de abajo.
- Direction: Left o Right, el sentido en que se mueven las olas.
- Overlap: de 0 a 120 píxeles. Lleva la franja sobre la sección siguiente para ocultar cualquier línea visible entre ellas.
- Width: Full (predeterminado) o Page.
Animated particles
- Shape: Dot, Bubble, Star o Snow.
- Count: de 5 a 40 partículas. Size: la partícula más grande, de 2 a 40 píxeles. Las demás son más pequeñas.
- Speed: Slow, Normal o Fast. Direction: Up (suben, como burbujas) o Down (caen, como nieve).
- Opacity: del 10% al 100%. Los valores bajos mantienen el efecto suave detrás de tu contenido.
- Height de la franja, de 40 a 600 píxeles, y Width (Full o Page).
Colores
Las dos franjas toman sus colores del Color scheme que elijas. Las olas usan el color Background del esquema, y el espacio detrás de ellas usa su color Inner background. Con las partículas es al revés: las partículas usan el color Inner background, y el espacio detrás de ellas usa el color Background. Para una unión limpia, haz coincidir esos dos colores con las secciones de encima y de debajo de la franja. Los esquemas se editan en Esquemas de colores. Las dos tienen también Padding (hasta 200 píxeles por cada lado).
Recetas
- Ambiente invernal: Animated particles con Shape Snow, Direction Down y una opacidad baja, colocada debajo del hero.
- Encabezado ondulado: Animated waves justo debajo del encabezado, con Merge with header activado y el mismo esquema de colores que el encabezado.
Bueno saberlo
- Se ve una línea entre las olas y la sección siguiente: sube Overlap o comprueba que los colores del esquema coinciden.
- Movimiento: los compradores que activaron la reducción de movimiento en su dispositivo ven las olas y las partículas quietas.
- Sin texto dentro: las olas y las partículas no contienen texto ni botones. Para mostrar un mensaje, añade una sección Text junto a la franja.
- No te pases: una o dos franjas por página mantienen la atención en tus productos.