![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/10\/Ajax-Pagination.png\")
<\/figure>\n\n[PRO] Introduzindo AJAX para Loop Grids – Para Carregamento de Conte\u00fado Sem Interrup\u00e7\u00f5es <\/strong><\/h2>\n\nEstamos empolgados em apresentar o quarto recurso mais solicitado no GitHub: carregamento AJAX para Loop Grids.\nAJAX, que significa JavaScript e XML Ass\u00edncronos, torna a experi\u00eancia do visitante do seu site mais suave ao carregar novo conte\u00fado em um Loop Grid sem recarregar a p\u00e1gina inteira. <\/p>\n\n
Pagina\u00e7\u00e3o de Loop Grid com AJAX <\/strong><\/h3>\n\nOs visitantes agora podem alternar entre p\u00e1ginas da sua lista sem recarregar a p\u00e1gina inteira.\nClicar no elemento de pagina\u00e7\u00e3o do Loop Grid recarrega apenas o conte\u00fado do Grid, facilitando uma experi\u00eancia mais suave para os visitantes que navegam por uma lista de produtos ou posts.\nA Pagina\u00e7\u00e3o AJAX tamb\u00e9m atribui a cada p\u00e1gina da sua lista seu pr\u00f3prio par\u00e2metro de URL<\/a>, tornando mais f\u00e1cil para os visitantes salvar ou compartilhar links para p\u00e1ginas espec\u00edficas da lista.\nPor exemplo, se voc\u00ea estiver criando um blog de receitas, os visitantes podem navegar facilmente por uma lista de receitas e compartilhar ou salvar links para p\u00e1ginas com receitas que gostaram. <\/p>\n\nO controle “Autoscroll” \u00e9 outro recurso do Carregamento AJAX.\nAtivar o autoscroll faz com que a p\u00e1gina role automaticamente para o topo do grid quando os visitantes mudam a pagina\u00e7\u00e3o.\nSe voc\u00ea estiver usando um Filtro de Taxonomia, pode definir um valor de deslocamento para o efeito de autoscroll para manter sua barra de filtro vis\u00edvel. <\/p>\n\n
Pagina\u00e7\u00e3o Individual para Loop Grids e Widget de Posts<\/strong><\/h3>\n\nEm vers\u00f5es anteriores, mudar a pagina\u00e7\u00e3o de uma lista afetava a pagina\u00e7\u00e3o de outras listas na mesma p\u00e1gina.\nPor exemplo, se um Loop Grid e um Widget de Posts estivessem na mesma p\u00e1gina, selecionar a terceira p\u00e1gina de um deles tamb\u00e9m carregaria a terceira p\u00e1gina do outro.\nNo entanto, com o recurso de Pagina\u00e7\u00e3o Individual, os visitantes agora podem mudar a pagina\u00e7\u00e3o de uma lista sem afetar outros Loop Grids e Widgets de Posts na p\u00e1gina.\nPor exemplo, em um blog de receitas, voc\u00ea pode adicionar um Loop Grid que exibe receitas vegetarianas ao lado de um Loop Grid ou Widget de Posts que exibe uma lista de todos os seus posts.\nOs visitantes podem mudar a pagina\u00e7\u00e3o do Widget de Posts ou do Loop Grid de forma independente. <\/p>\n\n![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/10\/Performance.png\")
<\/figure>\n\nMelhore o Desempenho do Site com LCP Mais R\u00e1pido<\/strong><\/h2>\n\nElementor 3.17 torna seu site ainda mais r\u00e1pido com dois recursos que v\u00e3o turbinar o tempo de carregamento do seu site. <\/p>\n\n
Otimizar Carregamento de Imagens<\/strong><\/h3>\n\nA primeira atualiza\u00e7\u00e3o de desempenho nesta vers\u00e3o \u00e9 resultado da parceria do Elementor com o Chrome para identificar oportunidades de melhorar o desempenho dos sites constru\u00eddos com Elementor.\nA colabora\u00e7\u00e3o envolve a utiliza\u00e7\u00e3o de ferramentas do Google, como o Chrome User Experience Report e o Core Web Vitals Technology Report.\nUm dos resultados do uso dessas ferramentas \u00e9 a decis\u00e3o do Google de contribuir com os recursos de “Otimizar carregamento de imagens” para o plugin principal do Elementor. <\/p>\n\n
Este recurso experimental melhora a velocidade do frontend priorizando o carregamento de imagens com base na posi\u00e7\u00e3o das imagens na p\u00e1gina.\nEle detecta qual imagem \u00e9 mais prov\u00e1vel de ser a “imagem LCP”, o maior elemento de pintura com conte\u00fado vis\u00edvel na janela de visualiza\u00e7\u00e3o, e prioriza seu carregamento usando dicas de prioridade. <\/p>\n\n
O experimento tamb\u00e9m aplica carregamento lento a imagens que n\u00e3o s\u00e3o exibidas inicialmente na janela de visualiza\u00e7\u00e3o e as carrega quando entram em vista.\nEssas mudan\u00e7as melhoram a m\u00e9trica LCP Core Web Vital em 5-10%, dependendo da complexidade da p\u00e1gina.\nPortanto, p\u00e1ginas com muitas imagens ter\u00e3o um aumento de desempenho ainda maior.\nEste recurso tamb\u00e9m funciona com sites Elementor rodando em vers\u00f5es mais antigas do WordPress que n\u00e3o incluem atualiza\u00e7\u00f5es de detec\u00e7\u00e3o de LCP. <\/p>\n\n
Carregamento de Ativos do Gutenberg<\/strong><\/h3>\n\nA segunda atualiza\u00e7\u00e3o de desempenho aumenta a velocidade do frontend do seu site ao excluir estilos e scripts do Gutenberg quando n\u00e3o est\u00e3o em uso.\nEste experimento melhora a m\u00e9trica LCP do seu site ao detectar quando o Gutenberg n\u00e3o foi usado para criar uma p\u00e1gina ou gerar seu conte\u00fado.\nIsso permite que o Elementor evite carregar c\u00f3digo desnecess\u00e1rio. <\/p>\n\n![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/10\/Star-Rating.png\")
<\/figure>\n\nNovo Widget de Avalia\u00e7\u00e3o para Flexibilidade de Design <\/strong><\/h2>\n\nO Elementor 3.17 introduz o novo Widget de Avalia\u00e7\u00e3o, oferecendo mais flexibilidade para personalizar suas escalas de avalia\u00e7\u00e3o visual para produtos, conte\u00fado e mais.\nVoc\u00ea pode representar visualmente sua avalia\u00e7\u00e3o usando \u00edcones do Font Awesome ou fazendo upload do seu pr\u00f3prio SVG.\nPor exemplo, para uma resenha musical, voc\u00ea pode usar seu SVG para dar a um novo \u00e1lbum uma avalia\u00e7\u00e3o de 5 em 5 discos de ouro. <\/p>\n\n
O Widget de Avalia\u00e7\u00e3o expande a gama de escalas de avalia\u00e7\u00e3o dispon\u00edveis no Widget de Avalia\u00e7\u00e3o por Estrelas.\nEm vez de ser limitado a uma escala de 0-5 ou 0-10, agora voc\u00ea pode definir uma escala de avalia\u00e7\u00e3o de zero a qualquer n\u00famero que atenda \u00e0s suas necessidades.\nPor exemplo, voc\u00ea pode dar a um \u00e1lbum uma avalia\u00e7\u00e3o de 3 em 3 ou 7 em 7 discos de ouro.\nO dropdown de Escala de Avalia\u00e7\u00e3o foi substitu\u00eddo por um intervalo para facilitar o uso. <\/p>\n\n
Al\u00e9m disso, o Widget de Avalia\u00e7\u00e3o melhora a classifica\u00e7\u00e3o de SEO do seu site com um atributo de esquema aprimorado.\nEle substitui o Widget de Avalia\u00e7\u00e3o por Estrelas no Painel de Widgets, mas quaisquer Avalia\u00e7\u00f5es por Estrelas existentes no seu site permanecer\u00e3o inalteradas. <\/p>\n\n![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/10\/Menu-improvements.png\")
<\/figure>\n\nScroll Horizontal Para Widget de Menu <\/strong><\/h2>\n\nO Elementor 3.17 oferece mais flexibilidade de design ao construir menus.\nAt\u00e9 agora, quando os visitantes mudavam o tamanho da janela de visualiza\u00e7\u00e3o, os menus redimensionavam para um “layout de dropdown” (tamb\u00e9m conhecido como “menu hamb\u00farguer”).\nCom as novas atualiza\u00e7\u00f5es no Widget de Menu, voc\u00ea pode evitar que os menus sejam redimensionados indo para as Configura\u00e7\u00f5es Responsivas, abrindo o menu dropdown rotulado \u201cPonto de Interrup\u00e7\u00e3o\u201d e selecionando “Nenhum”. <\/p>\n\n
Desativar o redimensionamento responsivo pode resultar em situa\u00e7\u00f5es onde o menu \u00e9 mais largo que a janela de visualiza\u00e7\u00e3o.\nEm muitos casos, isso pode fazer com que alguns itens do menu caiam para a pr\u00f3xima linha.\nPara evitar isso, o 3.17 tamb\u00e9m inclui a capacidade de habilitar a rolagem horizontal.\nQuando habilitado, seu menu manter\u00e1 seu design original em qualquer dispositivo e permitir\u00e1 que os visitantes rolem horizontalmente pelos itens do menu, em vez de interromper o design. <\/p>\n\n![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/10\/Accessibility-improvements.png\")
<\/figure>\n\nMelhorias de Acessibilidade<\/strong><\/h2>\n\n- Popups: Melhore o gerenciamento de foco ao habilitar a op\u00e7\u00e3o de Navega\u00e7\u00e3o Acess\u00edvel, focando inicialmente no bot\u00e3o de fechar o popup em vez de outros elementos foc\u00e1veis dentro dos popups.<\/li>
- Widget de \u00cdndice: Indique que o bot\u00e3o de minimizar\/maximizar no widget de \u00cdndice \u00e9 um elemento interativo para visitantes que utilizam tecnologias assistivas.<\/li>
- Widget de Acorde\u00e3o Aninhado: Melhore a acessibilidade dos layouts de Acorde\u00e3o para visitantes que utilizam navega\u00e7\u00e3o por teclado.<\/li><\/ul>\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/10\/Additional-Updates.png\")
<\/figure>\n\nAtualiza\u00e7\u00f5es Adicionais<\/strong><\/h2>\n\n- Designs de Templates Responsivos: Melhore sua capacidade de exibir corretamente as mudan\u00e7as feitas nos designs responsivos dos templates com pontos de interrup\u00e7\u00e3o adicionais.\nVoc\u00ea n\u00e3o precisar\u00e1 mais regenerar o CSS<\/a> para ver as mudan\u00e7as feitas nos templates ao editar no Construtor de Temas.\nAs mudan\u00e7as ser\u00e3o refletidas no Editor e no frontend do seu site. <\/li>
- Widget de Acorde\u00e3o com Esquema de FAQ: melhore a compatibilidade de SEO do seu conte\u00fado adicionando um controle de Esquema de FAQ.\nO Esquema de FAQ adiciona uma marca\u00e7\u00e3o especializada ao c\u00f3digo da sua p\u00e1gina que cont\u00e9m uma lista de perguntas e respostas.\nOs motores de busca podem ler essa marca\u00e7\u00e3o e us\u00e1-la para gerar c\u00f3digo rico. <\/li>
- Integra\u00e7\u00e3o com VideoPress: Integre o VideoPress perfeitamente ao seu site Elementor.\nAproveite todos os recursos que o VideoPress oferece, como v\u00eddeos auto-hospedados, arquivos de v\u00eddeo transcodificados para reprodu\u00e7\u00e3o em v\u00e1rios tipos de dispositivos, streaming adaptativo baseado no tamanho da tela do dispositivo e na largura de banda dispon\u00edvel, a capacidade de autenticar v\u00eddeos privados e muito mais. <\/li><\/ol>\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/10\/AI-history.png\")
<\/figure>\n\n[Elementor AI] Hist\u00f3rico de IA – Restaurar Conte\u00fado Gerado por IA <\/strong><\/h2>\n\nO Elementor 3.17 melhora seu fluxo de trabalho no Elementor AI com o recurso de Hist\u00f3rico de IA.\nEste recurso exibe prompts usados anteriormente e as imagens ou textos que eles geraram.\nVoc\u00ea pode restaurar prompts e seu conte\u00fado gerado, permitindo que voc\u00ea continue de onde parou.\nVoc\u00ea pode continuar editando o conte\u00fado com IA, us\u00e1-lo em seu site ou exclu\u00ed-lo permanentemente do Hist\u00f3rico de IA. <\/p>\n\n
Os visitantes agora podem alternar entre p\u00e1ginas da sua lista sem recarregar a p\u00e1gina inteira.\nClicar no elemento de pagina\u00e7\u00e3o do Loop Grid recarrega apenas o conte\u00fado do Grid, facilitando uma experi\u00eancia mais suave para os visitantes que navegam por uma lista de produtos ou posts.\nA Pagina\u00e7\u00e3o AJAX tamb\u00e9m atribui a cada p\u00e1gina da sua lista seu pr\u00f3prio par\u00e2metro de URL<\/a>, tornando mais f\u00e1cil para os visitantes salvar ou compartilhar links para p\u00e1ginas espec\u00edficas da lista.\nPor exemplo, se voc\u00ea estiver criando um blog de receitas, os visitantes podem navegar facilmente por uma lista de receitas e compartilhar ou salvar links para p\u00e1ginas com receitas que gostaram. <\/p>\n\n O controle “Autoscroll” \u00e9 outro recurso do Carregamento AJAX.\nAtivar o autoscroll faz com que a p\u00e1gina role automaticamente para o topo do grid quando os visitantes mudam a pagina\u00e7\u00e3o.\nSe voc\u00ea estiver usando um Filtro de Taxonomia, pode definir um valor de deslocamento para o efeito de autoscroll para manter sua barra de filtro vis\u00edvel. <\/p>\n\n Em vers\u00f5es anteriores, mudar a pagina\u00e7\u00e3o de uma lista afetava a pagina\u00e7\u00e3o de outras listas na mesma p\u00e1gina.\nPor exemplo, se um Loop Grid e um Widget de Posts estivessem na mesma p\u00e1gina, selecionar a terceira p\u00e1gina de um deles tamb\u00e9m carregaria a terceira p\u00e1gina do outro.\nNo entanto, com o recurso de Pagina\u00e7\u00e3o Individual, os visitantes agora podem mudar a pagina\u00e7\u00e3o de uma lista sem afetar outros Loop Grids e Widgets de Posts na p\u00e1gina.\nPor exemplo, em um blog de receitas, voc\u00ea pode adicionar um Loop Grid que exibe receitas vegetarianas ao lado de um Loop Grid ou Widget de Posts que exibe uma lista de todos os seus posts.\nOs visitantes podem mudar a pagina\u00e7\u00e3o do Widget de Posts ou do Loop Grid de forma independente. <\/p>\n\n Elementor 3.17 torna seu site ainda mais r\u00e1pido com dois recursos que v\u00e3o turbinar o tempo de carregamento do seu site. <\/p>\n\n A primeira atualiza\u00e7\u00e3o de desempenho nesta vers\u00e3o \u00e9 resultado da parceria do Elementor com o Chrome para identificar oportunidades de melhorar o desempenho dos sites constru\u00eddos com Elementor.\nA colabora\u00e7\u00e3o envolve a utiliza\u00e7\u00e3o de ferramentas do Google, como o Chrome User Experience Report e o Core Web Vitals Technology Report.\nUm dos resultados do uso dessas ferramentas \u00e9 a decis\u00e3o do Google de contribuir com os recursos de “Otimizar carregamento de imagens” para o plugin principal do Elementor. <\/p>\n\n Este recurso experimental melhora a velocidade do frontend priorizando o carregamento de imagens com base na posi\u00e7\u00e3o das imagens na p\u00e1gina.\nEle detecta qual imagem \u00e9 mais prov\u00e1vel de ser a “imagem LCP”, o maior elemento de pintura com conte\u00fado vis\u00edvel na janela de visualiza\u00e7\u00e3o, e prioriza seu carregamento usando dicas de prioridade. <\/p>\n\n O experimento tamb\u00e9m aplica carregamento lento a imagens que n\u00e3o s\u00e3o exibidas inicialmente na janela de visualiza\u00e7\u00e3o e as carrega quando entram em vista.\nEssas mudan\u00e7as melhoram a m\u00e9trica LCP Core Web Vital em 5-10%, dependendo da complexidade da p\u00e1gina.\nPortanto, p\u00e1ginas com muitas imagens ter\u00e3o um aumento de desempenho ainda maior.\nEste recurso tamb\u00e9m funciona com sites Elementor rodando em vers\u00f5es mais antigas do WordPress que n\u00e3o incluem atualiza\u00e7\u00f5es de detec\u00e7\u00e3o de LCP. <\/p>\n\n A segunda atualiza\u00e7\u00e3o de desempenho aumenta a velocidade do frontend do seu site ao excluir estilos e scripts do Gutenberg quando n\u00e3o est\u00e3o em uso.\nEste experimento melhora a m\u00e9trica LCP do seu site ao detectar quando o Gutenberg n\u00e3o foi usado para criar uma p\u00e1gina ou gerar seu conte\u00fado.\nIsso permite que o Elementor evite carregar c\u00f3digo desnecess\u00e1rio. <\/p>\n\n O Elementor 3.17 introduz o novo Widget de Avalia\u00e7\u00e3o, oferecendo mais flexibilidade para personalizar suas escalas de avalia\u00e7\u00e3o visual para produtos, conte\u00fado e mais.\nVoc\u00ea pode representar visualmente sua avalia\u00e7\u00e3o usando \u00edcones do Font Awesome ou fazendo upload do seu pr\u00f3prio SVG.\nPor exemplo, para uma resenha musical, voc\u00ea pode usar seu SVG para dar a um novo \u00e1lbum uma avalia\u00e7\u00e3o de 5 em 5 discos de ouro. <\/p>\n\n O Widget de Avalia\u00e7\u00e3o expande a gama de escalas de avalia\u00e7\u00e3o dispon\u00edveis no Widget de Avalia\u00e7\u00e3o por Estrelas.\nEm vez de ser limitado a uma escala de 0-5 ou 0-10, agora voc\u00ea pode definir uma escala de avalia\u00e7\u00e3o de zero a qualquer n\u00famero que atenda \u00e0s suas necessidades.\nPor exemplo, voc\u00ea pode dar a um \u00e1lbum uma avalia\u00e7\u00e3o de 3 em 3 ou 7 em 7 discos de ouro.\nO dropdown de Escala de Avalia\u00e7\u00e3o foi substitu\u00eddo por um intervalo para facilitar o uso. <\/p>\n\n Al\u00e9m disso, o Widget de Avalia\u00e7\u00e3o melhora a classifica\u00e7\u00e3o de SEO do seu site com um atributo de esquema aprimorado.\nEle substitui o Widget de Avalia\u00e7\u00e3o por Estrelas no Painel de Widgets, mas quaisquer Avalia\u00e7\u00f5es por Estrelas existentes no seu site permanecer\u00e3o inalteradas. <\/p>\n\n O Elementor 3.17 oferece mais flexibilidade de design ao construir menus.\nAt\u00e9 agora, quando os visitantes mudavam o tamanho da janela de visualiza\u00e7\u00e3o, os menus redimensionavam para um “layout de dropdown” (tamb\u00e9m conhecido como “menu hamb\u00farguer”).\nCom as novas atualiza\u00e7\u00f5es no Widget de Menu, voc\u00ea pode evitar que os menus sejam redimensionados indo para as Configura\u00e7\u00f5es Responsivas, abrindo o menu dropdown rotulado \u201cPonto de Interrup\u00e7\u00e3o\u201d e selecionando “Nenhum”. <\/p>\n\n Desativar o redimensionamento responsivo pode resultar em situa\u00e7\u00f5es onde o menu \u00e9 mais largo que a janela de visualiza\u00e7\u00e3o.\nEm muitos casos, isso pode fazer com que alguns itens do menu caiam para a pr\u00f3xima linha.\nPara evitar isso, o 3.17 tamb\u00e9m inclui a capacidade de habilitar a rolagem horizontal.\nQuando habilitado, seu menu manter\u00e1 seu design original em qualquer dispositivo e permitir\u00e1 que os visitantes rolem horizontalmente pelos itens do menu, em vez de interromper o design. <\/p>\n\n O Elementor 3.17 melhora seu fluxo de trabalho no Elementor AI com o recurso de Hist\u00f3rico de IA.\nEste recurso exibe prompts usados anteriormente e as imagens ou textos que eles geraram.\nVoc\u00ea pode restaurar prompts e seu conte\u00fado gerado, permitindo que voc\u00ea continue de onde parou.\nVoc\u00ea pode continuar editando o conte\u00fado com IA, us\u00e1-lo em seu site ou exclu\u00ed-lo permanentemente do Hist\u00f3rico de IA. <\/p>\n\nPagina\u00e7\u00e3o Individual para Loop Grids e Widget de Posts<\/strong><\/h3>\n\n
<\/figure>\n\nMelhore o Desempenho do Site com LCP Mais R\u00e1pido<\/strong><\/h2>\n\n
Otimizar Carregamento de Imagens<\/strong><\/h3>\n\n
Carregamento de Ativos do Gutenberg<\/strong><\/h3>\n\n
<\/figure>\n\nNovo Widget de Avalia\u00e7\u00e3o para Flexibilidade de Design <\/strong><\/h2>\n\n
<\/figure>\n\nScroll Horizontal Para Widget de Menu <\/strong><\/h2>\n\n
<\/figure>\n\nMelhorias de Acessibilidade<\/strong><\/h2>\n\n
<\/figure>\n\nAtualiza\u00e7\u00f5es Adicionais<\/strong><\/h2>\n\n
<\/figure>\n\n[Elementor AI] Hist\u00f3rico de IA – Restaurar Conte\u00fado Gerado por IA <\/strong><\/h2>\n\n
![\"\"](\"https:\/\/elementor.com\/blog\/wp-content\/uploads\/2023\/10\/Hello-theme-settings.png\")
<\/figure>\n\n