Novidade no Elementor 3.17 – Melhore a experiência do visitante com AJAX, sites mais rápidos e muito mais

Publicados: 2023-11-01

Esta versão apresenta o tão esperado carregamento AJAX para Loop Grids, que permite alterar a paginação sem recarregar a página inteira. Também otimiza o carregamento de imagens, melhorando o desempenho do seu site. O novo widget de classificação expande sua flexibilidade para fazer upload de um SVG personalizado e escolher qualquer escala de classificação. Além disso, as melhorias do Mega Menu permitem a rolagem horizontal para menus que não são minimizados no “Layout de Hambúrguer”.

Hello Theme foi atualizado para a versão 2.9, apresentando uma nova página de configurações que permite desabilitar recursos integrados do tema para melhorar o desempenho do site.

[PRO] Apresentando AJAX para Loop Grids – para carregamento contínuo de conteúdo

Temos o prazer de apresentar o quarto recurso mais solicitado no GitHub: carregamento AJAX para Loop Grids. AJAX, que significa Asynchronous JavaScript and XML, torna a experiência do visitante do seu site mais tranquila, carregando novo conteúdo em uma Loop Grid sem recarregar a página inteira.

Paginação de grade de loop AJAX

Os visitantes agora podem alternar entre as páginas da sua listagem sem recarregar a página inteira. Clicar no elemento de paginação do Loop Grid apenas recarrega o conteúdo do Grid, facilitando uma experiência mais tranquila para os visitantes que navegam por uma lista de produtos ou postagens. A paginação AJAX também atribui a cada página da sua listagem seu próprio parâmetro de URL, tornando mais fácil para os visitantes salvar ou compartilhar links para páginas de listagem específicas. Por exemplo, se você estiver criando um blog de receitas, os visitantes poderão navegar facilmente por uma lista de receitas e compartilhar ou salvar links para páginas com receitas de que gostaram.

O controle “Autoscroll” é outro recurso do carregamento AJAX. A ativação da rolagem automática rola automaticamente para o topo da grade quando os visitantes alteram a paginação. Se estiver usando um Filtro de Taxonomia, você poderá definir um valor de deslocamento para o efeito de rolagem automática para manter sua barra de filtro à vista.

Widget de paginação individual para grades de loop e postagens

Nas versões anteriores, a alteração da paginação de uma listagem afetava a paginação de outras listagens na mesma página. Por exemplo, se um Loop Grid e um Posts Widget fossem colocados na mesma página, selecionar a terceira página de um deles também carregaria a terceira página do segundo. No entanto, com o recurso Paginação Individual, os visitantes agora podem alterar a paginação de uma listagem sem afetar outras Loop Grids e Posts Widgets na página. Por exemplo, em um blog de receitas, você pode adicionar um Loop Grid que exibe receitas vegetarianas ao lado de um Loop Grid ou Posts Widget que exibe uma lista de todas as suas postagens. Os visitantes podem alterar a paginação do Post Widget ou do Loop Grid de forma independente.

Melhore o desempenho do site com LCP mais rápido

Elementor 3.17 torna seu site ainda mais rápido com dois recursos que irão turbinar o tempo de carregamento do seu site.

Otimize o carregamento de imagens

A primeira atualização de desempenho nesta versão é resultado da parceria da Elementor com o Chrome para identificar oportunidades de melhoria de desempenho de sites construídos pela Elementor. A colaboração envolve a utilização de ferramentas do Google, como o Relatório de experiência do usuário do Chrome e o Relatório de tecnologia Core Web Vitals. Um dos resultados do uso dessas ferramentas é a decisão do Google de contribuir com os recursos “Otimizar o carregamento de imagens” para o plugin principal do Elementor.

Este recurso experimental melhora a velocidade do frontend, priorizando o carregamento de imagens com base no posicionamento das imagens na página. Ele detecta qual imagem tem maior probabilidade de ser a “imagem LCP”, o elemento de pintura com maior conteúdo na janela de visualização, e prioriza seu carregamento usando dicas de prioridade.

O experimento também aplica carregamento lento a imagens não exibidas inicialmente na janela de visualização e as carrega quando aparecem. Essas alterações melhoram a métrica LCP Core Web Vital em 5 a 10%, dependendo da complexidade da página. Assim, as páginas com muitas imagens terão um aumento de desempenho ainda maior. Este recurso também funciona com sites Elementor executados em versões mais antigas do WordPress que não incluem atualizações de detecção de LCP.

Carregamento de ativos de Gutenberg

A segunda atualização de desempenho aumenta a velocidade de front-end do seu site, excluindo estilos e scripts Gutenberg quando não estão em uso. Esta experiência melhora a métrica LCP do seu site detectando quando o Gutenberg não foi usado para criar uma página ou gerar seu conteúdo. Isso permite que o Elementor evite carregar código desnecessário.

Novo widget de classificação para flexibilidade de design

Elementor 3.17 apresenta o novo Rating Widget, oferecendo mais flexibilidade para personalizar suas escalas de classificação visual para produtos, conteúdo e muito mais. Você pode representar visualmente sua classificação usando ícones Font Awesome ou enviando seu próprio SVG. Por exemplo, para uma crítica musical, você pode usar seu SVG para atribuir a um novo álbum uma classificação de 5 em 5 discos de ouro.

O Rating Widget expande a gama de escalas de classificação disponíveis no Star Rating Widget. Em vez de ficar limitado a uma escala de 0 a 5 ou de 0 a 10, agora você pode definir uma escala de classificação de zero a qualquer número que atenda às suas necessidades. Por exemplo, você pode atribuir a um álbum uma classificação de 3 em 3 ou 7 em 7 discos de ouro. O menu suspenso Escala de classificação foi substituído por um intervalo para facilitar o uso.

Além disso, o Rating Widget melhora a classificação SEO do seu site com um atributo de esquema aprimorado. Ele substitui o widget de classificação por estrelas no painel de widgets, mas quaisquer classificações por estrelas existentes em seu site permanecerão inalteradas.

Rolagem horizontal para widget de menu

Elementor 3.17 oferece mais flexibilidade de design ao construir menus. Até agora, quando os visitantes alteravam o tamanho da sua janela de visualização, os menus eram redimensionados para um “layout suspenso” (também conhecido como “menu hambúrguer”). Com as novas atualizações do widget de menu, você pode evitar o redimensionamento dos menus acessando Configurações responsivas, abrindo o menu suspenso denominado “Ponto de interrupção” e selecionando “Nenhum”.

Desabilitar o redimensionamento responsivo pode resultar em situações em que o menu é mais largo que a janela de visualização. Em muitos casos, isso pode deixar alguns itens do menu na próxima linha. Para evitar isso, o 3.17 também inclui a capacidade de ativar a rolagem horizontal. Quando ativado, seu menu manterá seu design original em qualquer dispositivo e permitirá que os visitantes rolem horizontalmente pelos itens do menu em vez de interromper o design.

Melhorias de acessibilidade

  • Pop-ups: melhore o gerenciamento de foco ao ativar a opção Navegação Acessível, concentrando-se inicialmente no botão de fechar pop-up em vez de outros elementos focalizáveis ​​dentro de pop-ups.
  • Widget de Índice: indica que o botão minimizar/maximizar no widget de Índice é um elemento interativo para visitantes que usam tecnologias assistivas.
  • Widget da barra de progresso: permite que os leitores de tela associem corretamente os rótulos às barras de progresso correspondentes.
  • Widget de lista de reprodução de vídeo: atribua tags HTML personalizadas a diferentes elementos no widget de lista de reprodução de vídeo.
  • Widget de acordeão aninhado: melhore a acessibilidade dos layouts de acordeão para visitantes que usam a navegação pelo teclado.

Atualizações Adicionais

  1. Designs de modelos responsivos: melhore sua capacidade de exibir corretamente as alterações feitas em designs responsivos de modelos com pontos de interrupção adicionais. Você não precisará mais gerar novamente o CSS para ver as alterações feitas nos modelos ao editar no Theme Builder. As alterações serão refletidas no editor e no frontend do seu site.
  2. Esquema de FAQ do widget Accordion: melhore a compatibilidade SEO do seu conteúdo adicionando um controle de esquema de FAQ. O esquema de FAQ adiciona uma marcação especializada ao código da sua página que contém uma lista de perguntas e respostas. Os mecanismos de pesquisa podem ler essa marcação e usá-la para gerar código rico.
  3. Integração VideoPress: Integre perfeitamente o VideoPress ao seu site Elementor. Aproveite todos os recursos que o VideoPress oferece, como vídeos auto-hospedados, arquivos de vídeo transcodificados para reprodução em vários tipos de dispositivos, streaming adaptável com base no tamanho da tela do dispositivo e na largura de banda disponível, a capacidade de autenticar vídeos privados e muito mais.

[Elementor AI] Histórico de IA – Restaurar conteúdo gerado por IA

Elementor 3.17 aprimora seu fluxo de trabalho no Elementor AI com o recurso AI History. Este recurso exibe prompts usados ​​anteriormente e as imagens ou textos que eles geraram. Você pode restaurar prompts e seu conteúdo gerado, permitindo continuar de onde parou. Você pode continuar editando o conteúdo com IA, usá-lo em seu site ou excluí-lo permanentemente do Histórico de IA.

Embora não seja possível recuperar o código gerado anteriormente do Histórico de IA, já que o código é criado para widgets específicos, você pode acessar os prompts usados ​​para gerá-los para regenerar o novo código a partir dos seus prompts históricos. Por exemplo, você pode ter fechado acidentalmente seu navegador enquanto trabalhava em uma nova imagem de fundo ou decidido usar um texto gerado por IA que foi descartado. O Histórico de IA permite que você recupere e use os prompts e o conteúdo de até 90 dias atrás.

Personalize as configurações do tema com Hello Theme 2.9

Agora você pode ajustar as configurações do seu tema Hello, melhorando o desempenho do seu site com base em seus requisitos específicos. Hello Theme 2.9 apresenta uma variedade de recursos interessantes que melhoram a navegação, legibilidade, SEO e muito mais. Com esta versão, não há mais necessidade de alterar o código do tema para evitar configurações redundantes ou irrelevantes. Em vez disso, visite a nova página Configurações no painel do WordPress, onde você pode desativar recursos como meta tags de descrição, links para pular, títulos de páginas e outros. Desativar esses recursos reduz o tamanho do seu site e elimina CSS não utilizado.

Melhore a experiência do visitante, o tempo de carregamento e aproveite mais flexibilidade de design

Elementor 3.17 apresenta vários recursos para aprimorar a experiência do usuário e o desempenho do site. Um recurso significativo é o carregamento AJAX para Loop Grids, permitindo transições suaves de conteúdo sem recarregar a página inteira. Além disso, as otimizações de carregamento de imagens e o carregamento de ativos Gutenberg aumentam a velocidade do seu site. O novo Rating Widget oferece escalas de classificação visual flexíveis, e o Mega Menu agora inclui rolagem horizontal. Elementor AI também possui um painel de histórico de IA, concedendo acesso a prompts anteriores e conteúdo gerado. Além disso, a atualização do Hello Theme para a versão 2.9 permite aos usuários maior controle sobre as funcionalidades do site, incluindo a opção de desativar certos recursos integrados.

Deixe-nos saber qual recurso você está mais animado na seção de comentários!