Cuando creas un nuevo proyecto, verás un marco azul en tu página, que determina el ancho y el alto de tu diseño de escritorio. Por defecto, la anchura del marco se establece en 1024px, pero puedes personalizarlo y hacer que tu diseño tenga hasta 2880px de ancho. 

Para hacerlo, abre el panel de ‘Widgets’ en la esquina inferior derecha de tu pantalla y selecciona ‘Grid & Guides’. Haz clic en "1024" e introduce un nuevo valor para el ancho de tu diseño.

Para que el marco azul vuelva a ser visible, selecciona ‘Set 1’ en los ajustes de ‘Grid & Guides’ y pon el número de columnas a cero.

Si quieres que tu contenido sea adaptable a diferentes tamaños de pantalla, te recomendamos que actives la opción Scale Layout antes de empezar a construir tu proyecto. Puedes encontrar esta opción en la pestaña ‘Viewer’ de la configuración de tu proyecto. En este caso, no es necesario establecer la anchura de tu diseño: después de publicar, tu proyecto tendrá el mismo aspecto que tiene en el modo Editor. El marco azul no será visible en el Editor, si ‘Scale Layout’ está activado, ya que el área de diseño será la misma que el área de su pantalla. Pero asegúrate de mantener el zoom del navegador al 100% cuando previsualices el proyecto: esto mostrará exactamente cómo se verá el proyecto para tus visitantes.

Guides

Dentro del panel de Guías, puedes cambiar entre 3 conjuntos predefinidos. Para verlos, haz clic en ‘Set 1’ en la esquina superior izquierda de la configuración de ‘Grid and Guides’.

También puedes establecer tu propio número de columnas y líneas, su anchura y sus márgenes. Para que todas las columnas sean iguales, establece su anchura manualmente. De lo contrario, su anchura se calculará automáticamente en función de diferentes parámetros, lo que puede provocar imprecisiones. 

Grid

En ‘Grid’, también hay tres conjuntos por defecto que puedes modificar introduciendo los valores que necesites.

Snap

Si está activada la función ‘Snap’, un widget se alinea automáticamente a la cuadrícula, las guías y los widgets cercanos cuando lo mueves.

Sizes

Activa ‘Sizes’ para ver la altura y la anchura de todos tus widgets. Aprende más sobre cómo trabajar con los widgets aquí.

Blocks

‘Blocks’ es una función beta que te ofrece la oportunidad de trabajar por separado en diferentes partes de tu página. Conoce más sobre ella aquí.