Editor de Wix Studio: agregar y configurar una flexbox
2 min
En este artículo
- Paso 1 | Agrega una flexbox
- Paso 2 | Agrega ítems a la flexbox
- Paso 3 | Agrega elementos a la flexbox
Usa las flexboxes para optimizar la visualización del contenido de tu sitio. Las flexboxes son herramientas de diseño que se componen de contenedores adaptativos, por lo que se ajustan automáticamente al tamaño de pantalla de los visitantes.
Paso 1 | Agrega una flexbox
Abre el panel Agregar elementos para seleccionar un preajuste de flexbox y arrástralo a la página. Hay muchos diseños para elegir según el tipo de contenido que necesites mostrar (por ejemplo, solo imágenes, imágenes y texto, etc.)
Para agregar una flexbox:
- Haz clic en Agregar elementos
a la izquierda del Editor. - Haz clic en Herramientas de estilo.
- Haz clic en Flexboxes.
- Arrastra y suelta la flexbox elegida a la página.
Descubre cómo funciona:
Arrastra las manillas en el lienzo para ver cómo se reorganiza sin problemas el contenido de la flexbox en los distintos breakpoints.
Paso 2 | Agrega ítems a la flexbox
Las flexboxes se componen de varios ítems que son contenedores adaptativos. Puedes cambiar el número de ítems en una flexbox y el tamaño de los ítems cambiará automáticamente para que se ajusten al espacio disponible.
Para agregar un nuevo elemento, puedes hacer clic en Agregar ítem o usar el panel Administrar elementos en el Inspector profesional.
Paso 3 | Agrega elementos a la flexbox
Elige lo que deseas mostrar en la flexbox agregando elementos adicionales a los ítems. Puedes ocultar o mostrar ítems en diferentes breakpoints para crear una experiencia única para los visitantes, sin importar el dispositivo.
Para agregar elementos a un ítem:
- Haz clic en Agregar elementos a la izquierda del Editor.
- Selecciona el tipo de elemento que deseas agregar.
- Haz clic en el elemento elegido para agregarlo a la página.
- Arrastra el elemento al ítem de la flexbox y suéltalo cuando veas que aparece la palabra Adjuntar.
¿Cuál es el siguiente paso?
Personaliza y administra la flexbox para mostrar el contenido que quieras, como quieras.