Nuevo en Elementor 3.17: mejore la experiencia de los visitantes con AJAX, sitios web más rápidos y más

Publicado: 2023-11-01

Esta versión presenta la tan esperada carga AJAX para Loop Grids, que le permite cambiar la paginación sin recargar toda la página. También optimiza la carga de imágenes, mejorando el rendimiento de su sitio. El nuevo widget de calificación amplía su flexibilidad para cargar un SVG personalizado y elegir cualquier escala de calificación. Además, las mejoras del Mega Menú permiten el desplazamiento horizontal de los menús que no se minimizan en el "Diseño de hamburguesa".

Hello Theme se actualizó a la versión 2.9 y presenta una nueva página de configuración que le permite desactivar las funciones integradas del tema para mejorar el rendimiento del sitio.

[PRO] Presentamos AJAX para Loop Grids: para una carga de contenido fluida

Nos complace presentar la cuarta característica más solicitada en GitHub: carga AJAX para Loop Grids. AJAX, que significa JavaScript asincrónico y XML, hace que la experiencia del visitante de su sitio sea más fluida al cargar contenido nuevo en un Loop Grid sin recargar toda la página.

Paginación de cuadrícula de bucle AJAX

Los visitantes ahora pueden cambiar entre las páginas de su listado sin recargar la página completa. Al hacer clic en el elemento de paginación de Loop Grid solo se recarga el contenido de Grid, lo que facilita una experiencia más fluida para los visitantes que navegan por una lista de productos o publicaciones. AJAX Pagination también asigna a cada página de su listado su propio parámetro de URL, lo que facilita a los visitantes guardar o compartir enlaces a páginas de listado específicas. Por ejemplo, si está creando un blog de recetas, los visitantes pueden navegar fácilmente a través de una lista de recetas y compartir o guardar enlaces a páginas con recetas que les gustaron.

El control "Autodesplazamiento" es otra característica de AJAX Loading. Al activar el desplazamiento automático, se desplaza automáticamente a la parte superior de la cuadrícula cuando los visitantes cambian la paginación. Si está utilizando un filtro de taxonomía, puede establecer un valor de compensación para el efecto de desplazamiento automático para mantener la barra de filtro a la vista.

Widget de paginación individual para cuadrículas de bucles y publicaciones

En versiones anteriores, cambiar la paginación de un listado afectaba la paginación de otros listados en la misma página. Por ejemplo, si tanto una cuadrícula de bucle como un widget de publicaciones se colocaran en la misma página, al seleccionar la tercera página de uno de ellos también se cargaría la tercera página de la segunda. Sin embargo, con la función de paginación individual, los visitantes ahora pueden cambiar la paginación de una lista sin afectar otras cuadrículas de bucle y widgets de publicaciones en la página. Por ejemplo, en un blog de recetas, puede agregar una cuadrícula de bucle que muestre recetas vegetarianas junto con una cuadrícula de bucle o un widget de publicaciones que muestre una lista de todas sus publicaciones. Los visitantes pueden cambiar la paginación del widget de publicación o de la cuadrícula de bucle de forma independiente.

Mejore el rendimiento del sitio web con un LCP más rápido

Elementor 3.17 hace que su sitio sea aún más rápido con dos funciones que acelerarán el tiempo de carga de su sitio web.

Optimizar la carga de imágenes

La primera actualización de rendimiento en esta versión es el resultado de la asociación de Elementor con Chrome para identificar oportunidades para mejorar el rendimiento de los sitios web creados por Elementor. La colaboración implica la utilización de herramientas de Google, como el Informe de experiencia del usuario de Chrome y el Informe de tecnología Core Web Vitals. Uno de los resultados del uso de estas herramientas es la decisión de Google de contribuir con las funciones "Optimizar la carga de imágenes" al complemento principal de Elementor.

Esta característica experimental mejora la velocidad de la interfaz al priorizar la carga de imágenes en función de la ubicación de las imágenes en la página. Detecta qué imagen es más probable que sea la "imagen LCP", el elemento de pintura con contenido más grande en la ventana gráfica, y prioriza su carga mediante sugerencias de prioridad.

El experimento también aplica la carga diferida a imágenes que no se muestran inicialmente en la ventana gráfica y las carga cuando aparecen. Estos cambios mejoran la métrica LCP Core Web Vital entre un 5% y un 10%, dependiendo de la complejidad de la página. Por lo tanto, las páginas con muchas imágenes disfrutarán de un aumento de rendimiento aún mayor. Esta característica también funciona con sitios web de Elementor que se ejecutan en versiones anteriores de WordPress que no incluyen actualizaciones de detección de LCP.

Carga de activos de Gutenberg

La segunda actualización de rendimiento aumenta la velocidad de la interfaz de su sitio al excluir los estilos y scripts de Gutenberg cuando no están en uso. Este experimento mejora la métrica LCP de su sitio al detectar cuándo no se utilizó Gutenberg para crear una página o generar su contenido. Esto permite a Elementor evitar cargar código innecesario.

Nuevo widget de calificación para flexibilidad de diseño

Elementor 3.17 presenta el nuevo widget de calificación, que ofrece más flexibilidad para personalizar sus escalas de calificación visual para productos, contenido y más. Puede representar visualmente su calificación usando íconos de Font Awesome o cargando su propio SVG. Por ejemplo, para una reseña musical, puedes usar tu SVG para darle a un nuevo álbum una calificación de 5 sobre 5 discos de oro.

El widget de calificación amplía la gama de escalas de calificación disponibles en el widget de calificación por estrellas. En lugar de limitarse a una escala de 0 a 5 o de 0 a 10, ahora puede establecer una escala de calificación desde cero hasta cualquier número que se adapte a sus necesidades. Por ejemplo, podrías darle a un álbum una calificación de 3 sobre 3 o 7 sobre 7 discos de oro. El menú desplegable Escala de calificación ha sido reemplazado por un rango para facilitar su uso.

Además, el widget de calificación mejora la clasificación SEO de su sitio con un atributo de esquema mejorado. Reemplaza el widget de calificación de estrellas en el panel de widgets, pero las calificaciones de estrellas existentes en su sitio no se verán afectadas.

Desplazamiento horizontal para el widget de menú

Elementor 3.17 ofrece más flexibilidad de diseño al crear menús. Hasta ahora, cuando los visitantes cambiaban el tamaño de su ventana gráfica, los menús cambiaban de tamaño a un "diseño desplegable" (también conocido como "menú hamburguesa"). Con las nuevas actualizaciones del widget de menú, puede evitar que los menús cambien de tamaño yendo a Configuración receptiva, abra el menú desplegable denominado "Punto de interrupción" y seleccione "Ninguno".

Deshabilitar el cambio de tamaño responsivo puede dar lugar a situaciones en las que el menú sea más ancho que la ventana gráfica. En muchos casos, esto puede hacer que algunos de los elementos del menú pasen a la siguiente línea. Para evitar esto, 3.17 también incluye la capacidad de habilitar el desplazamiento horizontal. Cuando esté habilitado, su menú mantendrá su diseño original en cualquier dispositivo y permitirá a los visitantes desplazarse horizontalmente por los elementos del menú en lugar de alterar el diseño.

Mejoras de accesibilidad

  • Ventanas emergentes: mejore la gestión del enfoque al habilitar la opción Navegación accesible, enfocándose inicialmente en el botón de cierre de la ventana emergente en lugar de otros elementos enfocables dentro de las ventanas emergentes.
  • Widget de tabla de contenido: indique que el botón minimizar/maximizar en el widget de tabla de contenido es un elemento interactivo para los visitantes que utilizan tecnologías de asistencia.
  • Widget de barra de progreso: permite a los lectores de pantalla asociar correctamente etiquetas con sus barras de progreso correspondientes.
  • Widget de lista de reproducción de vídeos: asigne etiquetas HTML personalizadas a diferentes elementos en el widget de lista de reproducción de vídeos.
  • Widget de acordeón anidado: mejore la accesibilidad de los diseños de acordeón para los visitantes que utilizan la navegación con el teclado.

Actualizaciones adicionales

  1. Diseños de plantillas responsivos: mejore su capacidad para mostrar correctamente los cambios realizados en diseños responsivos de plantillas con puntos de interrupción adicionales. Ya no necesitarás regenerar CSS para ver los cambios que realizaste en las plantillas al editar en Theme Builder. Los cambios se reflejarán en el editor y la interfaz de su sitio web.
  2. Esquema de preguntas frecuentes del widget de acordeón: mejore la compatibilidad SEO de su contenido agregando un control de esquema de preguntas frecuentes. El esquema de preguntas frecuentes agrega un marcado especializado al código de su página que contiene una lista de preguntas y respuestas. Los motores de búsqueda pueden leer este marcado y utilizarlo para generar código enriquecido.
  3. Integración de VideoPress: integre perfectamente VideoPress en su sitio Elementor. Disfrute de todas las funciones que ofrece VideoPress, como videos autohospedados, archivos de video transcodificados para reproducir en muchos tipos de dispositivos, transmisión adaptativa basada en el tamaño de la pantalla del dispositivo y el ancho de banda disponible, la capacidad de autenticar videos privados y más.

[Elementor AI] Historial de IA: restaurar contenido generado por IA

Elementor 3.17 mejora su flujo de trabajo en Elementor AI con la función Historial de AI. Esta función muestra indicaciones utilizadas anteriormente y las imágenes o textos que generaron. Puede restaurar las indicaciones y su contenido generado, lo que le permitirá continuar donde lo dejó. Puede continuar editando el contenido con IA, usarlo en su sitio o eliminarlo permanentemente del Historial de IA.

Si bien no puede recuperar el código generado previamente del Historial de IA, dado que el código se crea para widgets específicos, puede acceder a las indicaciones utilizadas para generarlos para regenerar código nuevo a partir de sus indicaciones históricas. Por ejemplo, es posible que haya cerrado accidentalmente su navegador mientras trabajaba en una nueva imagen de fondo o haya decidido utilizar un texto generado por IA que fue descartado. El Historial de IA le permite recuperar y utilizar las indicaciones y el contenido de hasta 90 días atrás.

Personalice la configuración del tema con Hello Theme 2.9

Ahora puede ajustar la configuración de su Hello Theme, mejorando el rendimiento de su sitio web según sus requisitos específicos. Hello Theme 2.9 presenta una variedad de funciones interesantes que mejoran la navegación, la legibilidad, el SEO y más. Con esta versión, ya no es necesario modificar el código del tema para evitar configuraciones redundantes o irrelevantes. En su lugar, visite la nueva página de Configuración en el panel de WordPress donde puede desactivar funciones como metaetiquetas de descripción, enlaces para omitir, títulos de páginas y otros. Deshabilitar estas funciones reduce el tamaño de su sitio web y elimina el CSS no utilizado.

Mejore la experiencia de los visitantes, el tiempo de carga y disfrute de una mayor flexibilidad de diseño

Elementor 3.17 introduce varias funciones para mejorar la experiencia del usuario y el rendimiento del sitio web. Una característica importante es la carga AJAX para Loop Grids, que permite transiciones de contenido fluidas sin recargar toda la página. Además, las optimizaciones de carga de imágenes y la carga de activos de Gutenberg aumentan la velocidad de su sitio. El nuevo widget de calificación proporciona escalas de calificación visuales flexibles y el mega menú ahora incluye desplazamiento horizontal. Elementor AI también cuenta con un panel de historial de IA, que le brinda acceso a indicaciones anteriores y contenido generado. Además, la actualización de Hello Theme a la versión 2.9 permite a los usuarios un mayor control sobre las funcionalidades del sitio web, incluida la opción de desactivar ciertas funciones integradas.

¡Háganos saber qué característica le entusiasma más en la sección de comentarios!