Elementor 2.5 Beta

Elementor 2.5

Hola probadores de Elementor!

Elementor v2.5.0 Beta está disponible, y le agradeceríamos si pudiera instalarlo y probarlo. A continuación se presenta una descripción de las novedades.

Conoce el diseño flexible

Posicionamiento personalizado

Elementor es un editor basado en cuadrícula, lo que significa que todos los diseños se construyen de acuerdo con una cuadrícula determinada, o estructura horizontal y vertical. Hasta ahora, puede arrastrar diferentes widgets y encajan en su lugar, según la columna y la sección en la que los arrastre.

Ahora, estamos ampliando nuestras opciones de posicionamiento y ofreciendo múltiples métodos avanzados de posicionamiento, especialmente para aquellos entusiastas de píxeles perfectos:

¡NUEVO! Elementos en linea

¿Quieres colocar 2 botones uno al lado del otro en la misma columna? ¡Ahora usted puede!

Antes, cada widget ocupaba el 100% de la columna. Ahora, puede configurar el widget como ‘Inline’, lo que significa que el widget ocupará el ancho mínimo que tiene.

Esto le permite, por ejemplo, colocar un icono junto a un encabezado, todo dentro de la misma columna.

Además, también tiene la opción de establecer cualquier ancho personalizado, por lo que el widget se ajusta exactamente en su lugar.

Una vez que elija Inline Width, también tendrá la opción de definir una alineación vertical específica por widget.

¡Tenga en cuenta! Para configurar varios widgets en línea, cada widget debe definirse como en línea por separado.

Flujo de prueba:

  • Haga clic en cualquier widget.
  • Vaya a la pestaña Avanzado> Posicionamiento personalizado> Ancho, y configúrelo en En línea (automático) / Personalizado.
  • Haz clic en otro widget, y haz lo mismo.
  • Ahora, ambos widgets deberían aparecer en la misma columna.

¡NUEVO! Posición absoluta

Vaya a cualquier widget, elija ‘Posición: Absoluto’ y podrá arrastrar el widget a cualquier ubicación de la página, independientemente de la cuadrícula. Apunte a cualquier lugar de la pantalla y simplemente arrastre el widget hacia allí.

¡Tenga en cuenta! El posicionamiento absoluto no es el método recomendado para crear diseños de páginas web. Dicho esto, resulta útil en muchas situaciones en las que desea colocar los distintos elementos de la página con mayor libertad.

01

¿No te gusta arrastrar? También puede establecer la posición absoluta utilizando las escalas X e Y. En el panel, encontrará varios controles adicionales: Orientación horizontal y Orientación vertical. Esto establece el punto de referencia para la posición absoluta. Aprende más sobre esto aquí.

El posicionamiento absoluto también se puede configurar por separado para dispositivos móviles, tabletas y de escritorio.

Flujo de prueba:

Haga clic en cualquier widget.

  • Vaya a la pestaña Avanzado> Posicionamiento personalizado> Posición, y configúrelo en “Absoluto”.
  • Coloca el cursor sobre el widget y agarra el ícono de flechas aqua
  • Ahora, debería poder arrastrar el widget a cualquier lugar de la página

¡NUEVO! Posición fija

¿Te gusta usar posicionamiento adhesivo para widgets? Entonces te ENCANTARÁ esta nueva opción.
Configure su widget para tener una posición fija y colóquelo en una posición personalizada. Ahora su elemento se desplazará a lo largo del viaje de sus usuarios en su sitio web.

20

¿Confundido entre Sticky y Fixed?
Sticky es un efecto de desplazamiento que se relaciona con la sección en la que está ubicado. La posición fija, sin embargo, es relativa a la ventana gráfica del usuario. ¡Eso es!

Flujo de prueba:

  • Haga clic en cualquier widget
  • Vaya a la pestaña Avanzado> Posicionamiento personalizado> Posición, y configúrelo en “Fijo”.
  • Coloca el cursor sobre el widget y agarra el ícono de flechas aqua.
  • Ahora, debería poder arrastrar el widget a cualquier lugar de la página.
  • Desplácese por su página y verifique que todo esté en su lugar.

Columna Vertical y Alineación Horizontal

¿Alguna vez ha construido una sección de servicios con diferentes columnas de altura que no están alineadas correctamente?
Ahora hemos agregado varias opciones para la alineación vertical y horizontal dentro de las columnas.

03

Alineamiento vertical

  • Top Parte superior
  • Middle Medio
  • Bottom Fondo
  • ¡NUEVO! Espacio entre: los widgets comienzan y terminan en el borde de la columna, con el mismo espacio entre ellos
  • ¡NUEVO! Espacio alrededor: los widgets están separados por igual, y los bordes son la mitad del espacio entre los widgets.
  • ¡NUEVO! Espacio equitativo: los widgets tienen el mismo espacio entre, antes y después de ellos.

Alineación horizontal

Esta nueva característica amplía la capacidad del posicionamiento en línea y le permite alinear horizontalmente los widgets en línea que se colocan en la misma fila.

  • ¡NUEVO! comienzo
  • ¡NUEVO! Centrar
  • ¡NUEVO! Fin
  • ¡NUEVO! Espacio entre: igual que el control vertical
  • ¡NUEVO! Espacio alrededor – Igual que el control vertical
  • ¡NUEVO! Espacio uniforme – Igual que el control vertical

Flujo de prueba:

  1. Cree 2 columnas, cada una con 3 widgets: imagen, texto y botón:
  2. Haz que uno de los widgets de texto sea más largo.
  3. Para cada columna, vaya a Columna> Diseño> Alineación vertical, y seleccione cada una de las opciones.* Make sure you get the desired effect, as seen in the image above. Asegúrese de obtener el efecto deseado, como se ve en la imagen de arriba.
  4. Agregue 3 iconos dentro de una columna (usando la opción en línea mencionada anteriormente)
  5. Vaya a Columna> Diseño> Alineación horizontal y seleccione cada una de las opciones.
  6. Asegúrate de extender los widgets, como se ve en la imagen de arriba.

Mejoras responsivas

En Elementor 2.5.0 agregamos un par de mejoras de respuesta muy demandadas:

Mostrar / Ocultar columnas por dispositivo (gracias @wayheming )
Ahora puede configurar su comportamiento de respuesta no solo para las secciones, sino también para las columnas. Elija en qué dispositivo mostrar cada una de sus columnas y obtenga más flexibilidad de diseño con esta opción.

Soporte responsivo para la animación de entrada
¿Necesita una animación de entrada deslizable en el escritorio, pero una animación diferente en el móvil? ¡No hay problema!

Simplemente elija la animación de entrada por dispositivo y personalice completamente las animaciones de su sitio web.
Tenga en cuenta que el control de animación de entrada se movió a una nueva ubicación, que solía ser “Efectos de desplazamiento” y ahora se llama “Efectos de movimiento”. Esta nueva sección contiene la animación de entrada y los controles pegajosos.

Flujo de prueba:

  1. Crea 3 columnas y agrega diferentes widgets a cada columna.
  2. Para cada widget, vaya a la configuración del widget> sección Efectos de movimiento> Animación de entrada y configure la animación de entrada deseada por dispositivo.
  3. Asegúrate de obtener la animación de entrada deseada en diferentes dispositivos.
  4. Use las 3 columnas creadas en el paso 1 y configure las opciones de respuesta para cada columna
  5. Vaya a la sección Columna> Avanzado> Responsivo y elija en qué dispositivo ocultar las columnas
  6. Asegúrate de ver las columnas deseadas en diferentes dispositivos.

Diseño mejorado del editor de texto

¿Quieres dividir tu widget de editor de texto en columnas? En Elementor v2.5.0, podrás establecer columnas para el texto dentro del widget.

07

Además, puede especificar las columnas por dispositivo y establecer su espacio entre las columnas.
¡Solo otro pequeño pero significativo retoque en esta distribución de sacudidas de polvo de diseño!

Flujo de prueba:

  • Coloque un widget de texto en su página y agréguele contenido.
  • Vaya a Estilo> y establezca la cantidad deseada de columnas.
  • Elija su espacio preferido entre las columnas.
  • Haz lo mismo para cada vista de dispositivo.
  • Vea si las columnas del editor de texto son como las quería en cada dispositivo.

Más mejoras

Por favor no te pierdas estos puntos:

  • Hemos mejorado nuestra infraestructura para un mejor rendimiento. El tiempo de carga del editor se ha reducido en al menos un 50% .
  • Recordar la última pestaña utilizada : cuando edita una pestaña del widget en el panel y luego cambia a un widget diferente, el editor recordará la última pestaña que usó. Luego, cuando vuelva a editar el widget, el panel mostrará la última pestaña, exactamente donde lo dejó.
  • Ahora puede agregar sombra de texto para los títulos del widget de imagen.
  • Se agregó acceso al rol de superadministrador en Modo de mantenimiento (Gracias @GermanKrutov )

Correcciones:

  • Mejoras: Fallos en las animaciones de entrada
  • Mejoras : Falla en la Carga de Bloque de la Biblioteca (en la carga de la primera página)
  • Mejoras : Panel vacío al pegar el estilo en algunos casos de borde

Cómo instalar la versión Beta

Si aún no has habilitado las pruebas beta en Elementor, sigue estos pasos:

  • Vaya a Elementor> Herramientas> Versiones.
  • Habilitar la función beta tester.
  • Vaya al Panel de control> Actualizaciones y actualice a la última versión beta.

También puede descargar la nueva versión aquí: downloads.wordpress.org/plugin/elementor.2.5.0-beta1.zip

Fecha designada para el lanzamiento: 4 de marzo de 2019 (estimado)

Muchas gracias por su apoyo y ayuda!

Leave a Reply