Editor de Wix Studio: personalizar una cuadrícula de sección
6 min de lectura
En el Editor de Wix Studio, las secciones vienen con una cuadrícula integrada, que contiene una sola celda (que alberga toda la sección). Divide la sección en más celdas para darle una estructura adaptativa al contenido. Tienes varios estilos personalizables para elegir.
En este artículo, aprende a hacer lo siguiente:
¿Quieres agregar celdas a un contenedor?
Puedes aplicar una cuadrícula CSS avanzada en el contenedor.
Agregar celdas a una sección
Agrega celdas a una sección para obtener un diseño estructurado y adaptativo. Mantener los elementos en celdas separadas garantiza que permanezcan en su lugar en todos los tamaños de pantalla. Elige un estilo y coloca los elementos en las celdas. Siempre puedes dividir las celdas o agregar otras nuevas más tarde.
Para agregar celdas a una sección:
- Selecciona la sección correspondiente en el Editor.
- Haz clic en el menú desplegable En blanco en la parte superior de la sección.
- Elige un estilo: Filas, Columnas, Collage, etc.
Consejo: Puedes cambiar el estilo desde el menú desplegable en cualquier momento; esta acción no moverá los elementos. - (Opcional) Arrastra elementos a las celdas correspondientes.
Intercambiar celdas en la cuadrícula
Reorganiza la cuadrícula de las secciones de forma rápida y eficiente intercambiando las celdas de lugar. Con la función de arrastrar y soltar, puedes alternar la posición de las celdas de forma instantánea entre 2 celdas: de manera inmediata, cada celda ocupa el lugar de la otra en la cuadrícula.
Para intercambiar celdas:
- Selecciona la sección correspondiente en el Editor.
- Selecciona la primera celda.
- Mantén pulsado el icono de arrastrar
en la parte superior de la celda mientras la arrastras a la otra celda.
Consejo: Cuando veas la indicación Cambiar contenido, significa que puedes soltar la celda.
Personalizar la cuadrícula de la sección
Haz que las celdas y la cuadrícula se vean tal y como quieres. Puedes dividir o fusionar celdas existentes, agregar nuevas y arrastrar las líneas de la cuadrícula para ajustar su tamaño. También puedes agregar espacios para crear un poco de lugar entre las celdas.
Para personalizar la cuadrícula de la sección:
- Selecciona la sección correspondiente en el Editor.
- Elige cómo quieres personalizar la cuadrícula:
Dividir una celda existente
o Dividir verticalmente 
.
Agregar una nueva celda
Fusionar celdas
Cambiar el tamaño de una celda
Agregar espacios entre celdas
Eliminar una celda
.Nota:
En la actualidad, no es posible duplicar una celda.
Aplicar una cuadrícula CSS avanzada
Aplicar una cuadrícula CSS avanzada te da un control más preciso del estilo por breakpoint. Puedes elegir el número de filas y columnas que deseas, y establecer su tamaño mediante medidas adaptativas (por ejemplo, fr, mín./máx., %).
Para cambiar de una cuadrícula de sección a una cuadrícula CSS:
- Selecciona la sección correspondiente en el Editor.
- Haz clic en la flecha Abrir el Inspector profesional
en la parte superior derecha del Editor. - Desplázate hacia abajo hasta Estilo.
- Haz clic en Aplicar junto a Cuadrícula CSS avanzada.
- Haz clic en Aplicar en la ventana emergente ¿Aplicar cuadrícula CSS avanzada?
¿Te ha sido útil?
|