Orden estricto en Zero Block

En Zero Block, ahora puedes establecer la disposición de los elementos dentro de Auto Layout en diferentes resoluciones de pantalla utilizando la configuración de Orden Estricto. Esto resulta útil cuando se desea que la posición de los elementos del grupo Flex varíe en las versiones móvil y de escritorio.

La configuración de Orden Estricto define el orden de los elementos dentro del Diseño Automático. Por defecto, todos los elementos flexibles tienen un valor de orden de 0 (No establecido). Los elementos con un valor de orden inferior se colocan primero. Si establece uno de ellos en -1 (Primero), el elemento se colocará en primer lugar. Si es 1 (Último), se colocará en último lugar.

Puede establecer un valor de Orden estricto diferente para cada resolución de pantalla. Por ejemplo, en un ordenador de sobremesa, el texto puede ser el tercer elemento del grupo, y en un móvil, el último.

El Orden estricto también es útil para composiciones complejas con un gran número de elementos. Si es necesario reordenar varios de ellos para la pantalla del móvil, especifique un número diferente para cada uno de ellos mediante Valor personalizado (por ejemplo, de 1 a 6). Esto facilitará su disposición en el orden deseado.

Veamos un ejemplo con un bloque de ficha de producto para ver cuándo puede ser útil la configuración de Orden estricto.

En Zero Block, hemos creado un diseño con seis elementos: Cuatro fichas de producto y dos mosaicos que enlazan con el Catálogo. Este grupo tiene un Auto Layout común para facilitar la edición de contenidos y el diseño de versiones responsive.

Al pasar a editar la versión móvil, el orden de las tarjetas puede desorganizarse. Si las mueves manualmente, la composición también cambia en la versión de escritorio.

Para evitarlo, puede asignar un valor Personalizado en Orden estricto a los elementos que necesite. De este modo, las tarjetas aparecerán en el orden correcto en la versión móvil de su sitio web, mientras que el diseño de escritorio se mantiene tal y como lo diseñó.