Editor de Wix Studio: agregar y configurar una flexbox

2 min de lectura
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:

  1. Haz clic en Agregar elementos  a la izquierda del Editor.
  2. Haz clic en Herramientas de estilo.
  3. Haz clic en Flexboxes.
  4. Arrastra y suelta la flexbox elegida a la página.
El panel Agregar elementos en el Editor de Wix Studio. El cursor pasa el cursor sobre un estilo de flexbox.
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. 
Flexbox en blanco en el Editor. El cursor pasa el cursor sobre el botón Agregar ítems.

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:

  1. Haz clic en Agregar elementos  a la izquierda del Editor.
  2. Selecciona el tipo de elemento que deseas agregar.
  3. Haz clic en el elemento elegido para agregarlo a la página.
  4. Arrastra el elemento al ítem de la flexbox y suéltalo cuando veas que aparece la palabra Adjuntar.
Un botón que ha sido arrastrado a una flexbox. Se muestra el mensaje Adjuntar.
¿Cuál es el siguiente paso?
Personaliza y administra la flexbox para mostrar el contenido que quieras, como quieras.

¿Te ha sido útil?

|