La forma en que organizas el contenido de tu sitio web es fundamental. Una buena organización facilita que los visitantes encuentren lo que buscan y te permite destacar secciones que de otro modo podrían pasar desapercibidas. Una página bien organizada le da un aspecto profesional a tu sitio y ayuda a aumentar las ventas al facilitar que los visitantes encuentren lo que buscan.
Estructura de los Sitios web de Guesty
El creador de sitios web se compone de un encabezado, un pie de página, filas y columnas. Cada widget que añades se insertará en una de estas secciones.
Los widgets suelen ocupar todo el ancho de una columna o fila, lo que dificulta su selección. Para solucionar esto, haz clic con el botón derecho en el widget de la columna o fila que deseas seleccionar, coloca el cursor sobre la opción Seleccionar contenedor y, a continuación, selecciona Columna o Fila .
Filas
Las filas son las secciones horizontales de tu sitio web. Al añadir widgets y columnas, estos se colocan dentro de estas filas. Para cambiar la visualización del contenido en la vista móvil, haz clic en el interruptor para invertir el orden de las columnas en el editor de filas. Debes estar editando las opciones de diseño de la fila en la vista móvil para acceder a esta opción.
Puedes añadir filas a tu sitio web arrastrando widgets. Al arrastrar un widget entre filas o al espacio donde deseas añadir una fila, se creará una nueva fila al soltar el widget.
Para eliminar una fila, haz clic con el botón derecho en cualquier parte de la fila para abrir el menú contextual y, a continuación, haz clic en Eliminar . También puedes hacer clic en el botón Fila situado en la esquina superior izquierda de la fila y, a continuación, en Eliminar .
Nota:
Para obtener información detallada sobre cómo editar y organizar filas, consulta el Editor de filas .
Columnas
Cada fila contiene al menos una columna. Las columnas contienen todos los widgets de tu sitio y controlan su disposición.
Cada fila puede contener hasta cuatro columnas. Al agregar una nueva columna, esta aparecerá junto a la columna existente en esa fila.
Nota:
- Mientras que las versiones para ordenadores de escritorio y tabletas permiten que cada fila contenga hasta cuatro columnas, los sitios web para móviles solo pueden mostrar un máximo de dos columnas por fila.
- Las columnas añadidas en las vistas de escritorio o tableta ocuparán todo el ancho de la página al cambiar a la vista móvil; para crear una fila con dos columnas en la vista móvil, primero cambie a la vista móvil y, a continuación, añada un widget de dos columnas.
Para eliminar una columna, haga clic con el botón derecho en cualquier parte de la columna para abrir el menú contextual y, a continuación, haga clic en Eliminar. También puede hacer clic en la X roja situada en la esquina superior derecha de la columna.
Puede colocar widgets directamente en las columnas o estructurar aún más la columna añadiendo filas internas.
Nota:
Para obtener información detallada sobre cómo editar y organizar columnas, consulte el Editor de columnas.
Filas Interiores
Las filas internas ofrecen mayor flexibilidad de diseño, ya que permiten añadir filas dentro de las columnas. Gracias a ellas, puede variar la disposición de las columnas manteniendo el diseño general de la fila (por ejemplo, el fondo, el espaciado y el sangrado).
Al igual que las filas normales, las filas internas pueden tener su propio fondo y espaciado, dividirse en hasta cuatro columnas y modificar su orden en dispositivos móviles. Las columnas de las filas internas pueden contener cualquier widget, pero no se pueden añadir filas internas a dichas columnas.
Para agregar una fila interior a una columna, realice una de las siguientes acciones:
- Haga clic con el botón derecho en la fila y seleccione Agregar fila interior. Si la fila tiene varias columnas, elija a qué columna desea agregar las filas interiores.
- Haga clic con el botón derecho en la columna y haga clic en Agregar fila interior.
- Haga clic con el botón derecho en la fila interior y seleccione Agregar fila para colocar una fila interior debajo de la actual.
Ejemplo de Fila Interior
Para ilustrar cómo usar la fila interna, veamos dos maneras de crear un diseño que contenga un título y tres botones:
- Agrega dos filas. Coloca el título en la fila 1 con una columna. Divide la fila 2 en tres columnas. Coloca un botón en cada columna.
- Dos filas distintas no pueden compartir la misma imagen de fondo, por lo que deberás configurar el espaciado y el sangrado por separado para cada fila.
- Agrega una fila. Por defecto, cada fila contiene una columna. Agrega dos filas internas a la columna. Coloca el título en la primera fila interna. Divide la segunda fila interna en tres columnas. Coloca un botón en cada columna.
-
Estas dos filas internas compartirán el fondo, el espaciado y el sangrado de la fila principal.
-
Algunas consideraciones importantes a la hora de editar filas internas:
- Solo puedes usar las flechas de cambio de orden para intercambiar el orden entre las filas internas. Para intercambiar el orden de los widgets y las filas internas, debes arrastrar y soltar manualmente los widgets por encima o por debajo de la fila interna.
- Los widgets de 2, 3 y 4 columnas no se pueden colocar en filas internas. Para agregar una columna, haz clic con el botón derecho en la fila y selecciona "Agregar columna".
- A diferencia de las filas normales, las filas internas no se pueden copiar y pegar.
Widgets
Los widgets contienen el texto, las imágenes, los botones y otros contenidos de su sitio web.
Para añadir widgets a su sitio:
- En el panel izquierdo, haga clic en Widgets .
- Busque el widget que desee y luego arrástrelo y suéltelo en su sitio web.
Para eliminar un widget de su sitio, haga clic con el botón derecho en cualquier parte del widget para abrir el menú contextual y, a continuación, haga clic en Eliminar . También puede hacer clic en la X roja que aparece en la esquina superior derecha del widget.
Para colocar widgets uno al lado del otro, arrastre un widget a su sitio web, agregue una columna a la fila donde se encuentra y luego arrastre otro widget a esa columna. Como alternativa, arrastre el widget de dos columnas a su sitio web y luego arrastre y suelte los widgets en cada columna.
Ajustar para alinear
Al redimensionar widgets dentro de la misma columna, Guesty Sitios web intenta ajustarlos para que tengan exactamente el mismo tamaño. Al redimensionarlos, Guesty Sitios web se desplaza hacia adelante o hacia atrás para ajustarse a la posición. Esto debería facilitar que los widgets tengan exactamente el mismo tamaño.
Ajustar a la cuadrícula
La función Ajustar a la cuadrícula ayuda a colocar widgets en las páginas de su sitio con precisión profesional. Este sistema permite alinear widgets horizontal y verticalmente dentro de columnas y filas. Se muestran reglas al mover un elemento en su fila o columna, o al cambiar el tamaño del widget. Los elementos alineados se marcan con un borde de color. Un widget puede alinearse con varios widgets, según el caso de uso específico.
Nota:
La alineación es compatible con las vistas de los tres dispositivos diferentes (ordenador de escritorio, tableta y móvil).
Para obtener más información sobre cómo agregar y editar widgets, consulte Agregar widgets y Editar widgets .
