Añadir y editar secciones de Flex (1.0)

Para añadir una sección de Flex:

1. Mantenga el cursor entre filas y haga clic en el botón Agregar sección. Las secciones se muestran en el panel lateral. También puede hacer clic con el botón derecho para abrir el menú contextual y, luego, hacer clic en Añadir sección.
2. En el panel lateral, haga clic en Secciones Flex.
3. Haga clic en la sección Flex que desee añadir y, en la parte superior de la pantalla, haga clic en Guardar.
4. Se abre el modo Flex con la sección a editar.

Añadir contenedores y flexboxes

Una vez que haya añadido una sección de Flex a su sitio, puede establecer su cuadrícula y añadir contenedores y flexboxes para contener los widgets en la sección.

Para configurar su cuadrícula en la sección, en el panel de Diseño, seleccione un diseño preestablecido en la sección Reorganizar diseño o bien, seleccione un número de columnas, filas y el espacio que desee entre cada una en la sección Personalizar diseño.

Para añadir contenedores o flexboxes a la cuadrícula:

1. Apunte a la cuadrícula y haga clic en el botón + añadir  ().
2. En la sección Elementos flexibles, haga clic en Contenedor, Flexbox vertical o Flexbox horizontal. Para obtener más información sobre cómo elegir un contenedor o flexbox, consulte Contenedores y Flexboxes (1.0).
3. Arrastre el contenedor o flexbox donde quiera que se encuentre en la cuadrícula. A medida que mueve el contenedor o el flexbox, aparecen puntos azules que le permiten fijar el contenedor o el flexbox en zonas de la cuadrícula. Puede ver dónde está anclado el elemento en el panel de Diseño, junto a Anclar en la sección Posición.
   
4. Cambie el tamaño del contenedor o flexbox arrastrando los bordes hasta el tamaño que desee.

Añadir y editar widgets

Una vez que haya añadido una sección de Flex a su sitio, haya configurado su cuadrícula y haya añadido un contenedor o flexbox, puede añadir widgets al contenedor o flexbox.

Si usa el editor clásico, puede arrastrar un widget del panel izquierdo y soltarlo en una cuadrícula; así, usted ingresará automáticamente en el modo flex.

Para añadir widgets:

1. Apunte al contenedor o flexbox y haga clic en el botón +.
2. Busque y seleccione el widget que desea añadir.
3. Arrastre y cambie el tamaño del widget en el contenedor hasta donde quiera que aparezca.
4. A medida que mueve el widget, aparecen puntos azules que le permiten anclar el widget a zonas del contenedor. Puede ver dónde está anclado el elemento en el panel de Diseño, junto a Anclar en la sección Posición.
   
5. Nota

   Los elementos dentro de un flexbox se colocan automáticamente en una lista vertical u horizontal.

6. Después de añadir un widget, aparece el Editor de contenido y puede configurar el widget.
7. Edite el diseño del widget en el panel de diseño.

Seleccionar elementos

Hay varios métodos que puede usar para seleccionar un elemento:

• Pase el cursor del mouse sobre el elemento y haga clic. El primer clic selecciona la capa superior del elemento, el segundo clic selecciona la capa anidada, el tercer clic selecciona la siguiente capa anidada y así sucesivamente.

• Pase el cursor sobre el elemento y haga doble clic. Esto seleccionará el elemento por el que pasó el cursor, independientemente de cómo esté anidado.

• Pase el cursor del mouse sobre el elemento y haga clic en Command/Control + Select. Esto seleccionará el elemento por el que pasó el cursor, independientemente de cómo esté anidado.

Copie y pegue los elementos y widgets flex

Puede copiar y pegar los elementos (cuadrículas, contenedores, flexboxes) y widgets flex cuando esté en modo flex. Por ejemplo, puede copiar una cuadrícula desde una página y pegarla en una sección flex de otra página. También puede copiar widgets desde el editor habitual y pegarlos en las secciones flex. La función de copiar y pegar le ahorra tiempo, ya que le permite recrear rápidamente diseños complejos y crear sitios de manera más rápida.

Para copiar y pegar elementos o widgets flex cuando está en el modo flex, haga clic con el botón derecho en el elemento o en el widget y seleccione Copiar o Pegar en el menú. Para los widgets, también puede acceder a Copiar y Pegar seleccionando el widget y haciendo clic en Más ().

Para copiar un widget desde el editor habitual y pegarlo en una sección flex, haga clic en el widget en el editor habitual para abrir el menú Contenido y diseño. Haga clic en el icono de configuración () y seleccione Copiar en el menú. Vaya a la sección flex deseada, haga clic con el botón derecho y seleccione Pegar en el menú.

Reordenar elementos

Puede usar las flechas para mover elementos anidados en flexboxes, secciones y cuadrículas. Puede accederse a las flechas desde la barra flotante o haciendo clic con el botón derecho para abrir el menú contextual. Usar las flechas para reordenar los elementos ayuda a hacer las ediciones de manera más fluida y evita que se aniden elementos de manera inesperada.

Los elementos pueden moverse en las siguientes direcciones:

• Elementos anidados en flexboxes. Los elementos de flexboxes horizontales pueden moverse hacia la derecha y hacia la izquierda. Los elementos de flexboxes verticales pueden moverse hacia arriba y hacia abajo.

• Cuadrículas anidadas en una sección. Pueden moverse hacia arriba y hacia abajo.

• Elementos anidados en cuadrículas o contenedores. Pueden moverse en cualquier dirección siempre que haya dos elementos uno junto a otro y que se extiendan en toda la celda.