Reconocimiento de elementos de página

El formulario de pedido se divide en elementos de página en forma de secciones, filas y componentes que puedes reconocer por el marco de color:

• Secciones son verde menta

• Filas son azul real y pueden contener columnas

• Componentes son amarillo arena

• Secciones

  Las secciones forman la estructura básica del formulario de pedido. Puedes usarlas para dividir la página en áreas, p.ej., cabezera, cuerpo y pie. Puedes establecer el ancho de la página y una imagen de fondo para cada sección.

• Filas y columnas

  Al insertar una fila, eliges cuántas columnas tiene. Las columnas no pueden ser añadidas individualmente o suplementadas más tarde.

  • Las filas dividen la página en áreas horizontales. Puedes insertar múltiples filas una debajo de la otra y moverlas hacia arriba o hacia abajo con todo el contenido. De esta manera, puedes diseñar filas temáticamente, p.ej., una fila para datos del producto, una fila para campos de entrada, etc.

  • Las columnas te permiten mostrar contenido lado a lado dentro de las filas. Por ejemplo, puedes colocar datos de dirección junto a datos de pago.

• Componentes

  Los componentes te permiten añadir contenido específico. Cada componente tiene sus propias propiedades y opciones de configuración.

Al seleccionar un marco, se muestran elementos del marco, que incluyen botones de icono para varias acciones:

Mostrar y ocultar elementos de página

Para cada sección, fila o componente, puedes establecer la visibilidad en la configuración respectiva:

• Todos: El elemento de la página se muestra en todas las pantallas.

• Solo móvil o Solo escritorio: El elemento de la página se muestra solo en las pantallas respectivas y se oculta en otras. Por ejemplo, puedes mostrar una imagen de producto de forma prominente en pantallas fijas pero ocultarla en teléfonos inteligentes para facilitar la navegación allí. En estos casos, el contenido del elemento de la página está delineado en rojo y etiquetado:

  

• Ocultar: El elemento de la página no se muestra en absoluto. Esto te permite añadir contenido que aún no será utilizado. Por ejemplo, puedes añadir un componente para una imagen que aún está esperando aprobación.

Solo puedes ocultar elementos de página que no contengan componentes obligatorios. Los elementos de página ocultos pueden hacerse visibles nuevamente de la siguiente manera:

1. Presiona uno de los botones de secciones, filas o componentes en la barra superior y luego haz clic en gestionar. Se mostrará una barra lateral para navegar por los elementos de página respectivos.

2. Los elementos de página con un símoblo de ojo cruzado están ocultos. Presiona para hacer que el elemento de página sea visible de inmediato en el formulario de pedido. (El cambio solo será visible externamente después de la publicación.)

   

Configurar sección

• Los elementos del marco de la sección aparecen en los bordes.

• Presiona el icono de guardar para guardar la sección como plantilla.

• Presiona el icono de más para añadir secciones de plantilla nuevas o guardadas.

• Presiona los iconos de flecha para mover secciones.

• Presiona el icono de copiar para insertar inmediatamente una copia de la sección con todos los ajustes y filas contenidas debajo. Los componentes no se copian.

• Presiona el icono de engranaje para hacer ajustes. La barra lateral de sección aparecerá.

Configuraciones

• Margen superior

  Añade un margen transparente al borde superior de la página o la sección anterior. El margen se agrega al contenido de la sección pero no ensancha el contenido en sí (a diferencia del padding, ver más abajo).

• Imagen

  • Imagen de fondo: Establece una imagen de fondo para la sección. Esto anula la imagen de fondo de la página.

  • Posición de la imagen: Posiciona la imagen de fondo dentro de la sección.

  • Color de superposición: Superpone el fondo con un color. Usa un deslizador en la ventana de selección de color para determinar la transparencia del color. Por ejemplo, puedes superponer la imagen seleccionada con un velo blanco para que siga siendo visible pero no demasiado distractora.

• Tamaño y posición

  • Ancho de sección: Establece un ancho para hacer que el borde de la página sea más ancho o más estrecho, por ejemplo.

  • Permanente: Establece si la sección debe permanecer en una posición fija al desplazarse hacia arriba o hacia abajo. Esto es útil si la sección tiene solo contenido mínimo, como el botón de comprar. Puedes configurarlo para que el contenido de la sección siempre sea visiblemente prominente.

• Tamaño y posición de fila

  Aquí puedes hacer configuraciones centrales para todas las filas contenidas en esta sección. Estos tienen prioridad sobre las configuraciones en las filas individuales.

• Colores/ color de fondo

  Rellena el fondo con un color. Por ejemplo, puedes incrustar una imagen de fondo que no cubra completamente la sección en un color de fondo y superponerla con un color de superposición (transparente).

• Relleno

  El relleno significa añadir distancias dentro del contenido de la sección. Esto te permite ajustar los bordes entre el contenido y el marco de la sección. A diferencia del margen superior (ver arriba), el relleno también afecta la imagen de fondo o el color de fondo a medida que el área de visualización misma crece.

Configuraciones (avanzadas)

• Radio de esquina

  Establece si la sección debe tener esquinas redondeadas. Esto es particularmente efectivo al usar una imagen de fondo o color de fondo.

• Borde

  Establece si la sección debe tener un borde. El valor predeterminado es sin borde. Al seleccionar otra opción, se muestran campos adicionales. Los cambios serán notables una vez que todos los campos estén llenos con valores.

• Sombra

  Añade una sombra a la sección, haciéndola aparecer más tridimensional y prominente.

Configurar filas y columnas

• La fila está completamente delineada.

• Las columnas están separadas por un deslizador.

• Presiona el icono de guardar para guardar la fila como plantilla.

• Presiona el icono de más para añadir filas de plantilla nuevas o guardadas. Aparecerá una barra lateral.

  • Elige cuántas columnas debería tener la fila bajo Diseño.

  • Alternativamente, selecciona una plantilla que hayas guardado en Mis filas.

• Presiona los iconos de flecha para mover filas.

• Presiona el icono de copiar para insertar inmediatamente una copia de la fila con todos los ajustes y columnas debajo. Los componentes no se copian.

• Presiona el icono de engranaje para hacer ajustes.

Configuraciones

Las configuraciones de la fila son las mismas que las de la sección (ver arriba).