Editar tu web desde cero con Elementor desde la versión 2.9 de elementor es muy fácil: Puedes diseñar el encabezado, el pie de página y sobre todo el contenido y todo desde el mismo sitio.
La nueva versión Pro hace exactamente eso, optimizando las tareas de diseño web más comunes, como poder editar todo su sitio con menos clics.
La versión Pro 2.9 viene con no una sino tres nuevas características relacionadas con la edición global del sitio. Estas características incluyen edición completa del sitio, colores dinámicos y CSS personalizado global.
¿Te gusta construir un sitio web completo sin código con Elementor’s Theme Builder?
Ahora, lo estamos llevando al siguiente nivel, haciendo del Theme Builder una alternativa aún mejor a los temas cuando se trata de diseñar sitios de WordPress.
Presentación de la edición completa del sitio. Cambie entre editar su encabezado, pie de página y contenido con un simple clic de un botón.
Video de introducción sobre como editar toda la web con Elementor
Tutorial de uso para editar todo tu web con Elementor
Cómo funciona
- Dentro de Elementor, haga clic en el área del encabezado para editarlo.
- Luego, haga clic en el área de contenido para editar el contenido de la página.
- Finalmente, haga clic en el área del pie de página para realizar cambios en el pie de página.
¡Eso es! ¡Finalmente puede acceder a las diferentes partes de su sitio con un simple clic!
Cuando los diseñadores trabajan, a menudo necesitan entrar en el flujo, después de que sus jugos creativos se bombean. Brindar esta experiencia coherente eliminará el cambio entre pantallas y le permitirá diseñar su sitio desde un solo lugar, de arriba abajo.
No te preocupes por editar la sección incorrecta. La distinción visual del color entre los diferentes componentes del sitio asegurará que sepa exactamente lo que está editando en un momento dado.
COLORES DINÁMICOS
Aplicar colores en varios lugares
Hablando de simplificar su flujo de trabajo …
¿Alguna vez quisiste crear un sitio de comercio electrónico donde las diferentes páginas de productos cambien de color sin tener que configurar manualmente los colores en el editor?
¡Con la nueva función Dynamic Color, puedes!
Si recuerda, Dynamic Content es una característica útil que le permite crear sitios web avanzados como directorios y catálogos sin codificación.
Ahora puede agregar colores a la lista de elementos dinámicos que Elementor ofrece. Además de texto, números e imágenes, ahora puede incrustar valores de color dinámicos en las páginas de Elementor. Esta característica está disponible dentro de cualquier widget que tenga un campo de color.
Cómo funciona
- Cree un campo personalizado de color con ACF o con una solución diferente.
- Cree una plantilla única y agregue el campo personalizado de color que creó en diferentes áreas de la página.
- Agregue varias publicaciones y defina un color diferente como sus valores de campo personalizados de color.
- Aplique la plantilla única que creó a esas páginas.
Ahora debe mostrar que los colores que definió aparecen en cada una de las publicaciones.
Hay muchos casos de uso para esta función. Imagine una plantilla de página donde el encabezado, el color de fondo y el botón están configurados con el mismo color dinámico, extraído de un campo personalizado en su publicación o página. Una vez que lo cambie en el backend, la interfaz también cambiará.
Luego puede implementar esa plantilla en cientos de páginas de destino, cada una de las cuales obtiene automáticamente su propia paleta de colores.
Si crea una plantilla para una tarjeta de presentación en línea, puede aplicar la plantilla en cientos de tarjetas de presentación, obteniendo cada tarjeta un color diferente.
CSS GLOBAL
Establezca reglas CSS personalizadas en su sitio
Ya cubrimos el diseño de todo su sitio desde un solo lugar e implementar colores desde un solo lugar.
¿Qué pasa con la definición de reglas CSS personalizadas desde un solo lugar? Con Elementor Pro v2.9, puede agregar reglas CSS personalizadas que se aplicarán a todo su sitio.
¿Desea personalizar las reglas CSS que las reglas básicas de Theme Style no cubren (p. Ej., Pasar el cursor por encabezados o estados activos para enlaces)? Agréguelo en Estilo de tema> CSS personalizado, y se aplicará instantáneamente a todo su sitio. Además, siempre sabrá dónde encontrarlo, junto con otras reglas CSS globales que decida establecer.
Esta fue una característica muy solicitada, y nos complace resolverla para los muchos usuarios que buscan CSS personalizado global en Elementor.
Simplemente ingrese al menú Estilo de tema y abra la sección CSS personalizado. ¡Simple como eso!
SEO Y ACCESIBILIDAD
Mejore el SEO de su sitio con etiquetas semánticas HTML5
Puede mejorar el SEO de su sitio abordando HTML5 semántico.
Los contenedores especialmente nombrados pueden ayudar a los motores de búsqueda a identificar cómo están organizadas nuestras páginas, de acuerdo con SearchEngineLand .
Hasta ahora, estaba limitado a configurar estas etiquetas HTML en Secciones. Me refiero a etiquetas como encabezado, pie de página, principal, etc. Esto dificultó la asignación de una etiqueta HTML en un área completa, ya que la mayoría de las áreas estaban formadas por varias secciones.
A partir de ahora, puede establecer etiquetas HTML por parte del tema. Asigne todo su encabezado con la etiqueta `<header>`, toda su área de contenido con la etiqueta `<main>` y su pie de página con la etiqueta `<footer>`. Puede usar esta configuración para agregar cualquier otra etiqueta que esté en nuestras opciones (aparte, navegación, etc.)
Al asignar una etiqueta HTML relevante para cada elemento del tema, mejora la accesibilidad y la semántica HTML, así como también mejora su SEO en la página.
