Consejos de maquetación para temas Elementor y Astra: Mejores prácticas para contenedores y cuadrículas (07)

En el último número, exploramos laTema Astrade algunos consejos básicos sobre tipografía. Hoy vamos a seguir profundizando en cómo laElementorUtiliza mejor los diseños de contenedor y cuadrícula en el editor para ayudarte a crear diseños web más flexibles y estéticamente agradables. Tanto si eres un principiante como un diseñador experimentado, estos consejos te ayudarán.

Si necesita configurar dos, cuatro o incluso más diseños

Como se muestra arriba, primero tiene que añadir un contenedor (Container)

Pasos: front-end del sitio web → Editar con Elementor → Diseño → Contenedor o cuadrícula.

Cómo elegir el Contenedor y la Rejilla, esto debe basarse en la situación real, pero se recomienda preferir el Contenedor.

Container puede elegir entre una variedad de diseños, por supuesto, Grid también funciona, pero Container siempre puede añadir módulos en su interior, mientras que Grid es fijo, como se muestra a continuación, la caja roja es Container, si necesita mostrar múltiples módulos, sin duda Container, la caja amarilla es Grid, ¡el resultado es obvio!

Pero Grid también tiene sus propias ventajas, si usted ya tiene un contenedor, pero desea ser dividido en dos o incluso cuatro diseños, que restablecer el contenedor de dos diseños del contenedor no es capaz de arrastrar el contenedor a la primera, pero la cuadrícula se puede ajustar en cualquier momento, el siguiente gráfico, por lo que ir de acuerdo a la situación real para ajustar el

A continuación, vamos a hablar de la configuración y el método de dos diseños

El de arriba es un contenedor de dos diseños, el de la izquierda es un módulo de texto y título más un módulo de texto más un módulo de botón, el de la derecha es un módulo de una sola imagen

El primer módulo de texto a la izquierda ¿por qué la gente piensa que se puede ajustar tan pequeño

Encontramos el módulo de texto Editar Editor de texto

Pasos: Front-end → Editar con Elementor → Editar editor de texto.

Necesidad de cambiar el tamaño del texto, siga los pasos que he descrito anteriormente, el color se ajusta donde el contenido es

Eso lo establece.

¡Módulo de botón para establecer el texto y la posición puede ser, por supuesto, el estilo de color de fondo también se puede ajustar!

Pasos: Website Frontend→Edit with Elementor→Creative Button

El módulo de imagen de la derecha no ocupa toda la pantalla, simplemente recórtalo al tamaño adecuado si lo necesitas, en vertical, no en horizontal.

Así son los dos diseños

Por supuesto, los cuatro diseños son los mismos

Una vez configurados los cuatro diseños, añada un título y un módulo de texto a cada uno de ellos.

El color de fondo se establece en negro para un contenedor

El fondo del módulo es blanco

El módulo fija la anchura, así como la posición y el hueco

Resumen:

Al final de este artículo, usted debe tener una mejor comprensión de la utilización de contenedores y Grid y ser capaz de elegir el diseño adecuado para sus necesidades reales. Recuerda que Container es adecuado para necesidades de maquetación más flexibles, mientras que Grid puede ayudarte a dividir rápidamente la maquetación en contenedores existentes. En el próximo número, seguiremos ofreciéndote más consejos prácticos y trucos sobre el tema Astra, permanece atento.