Timeline Ultimate Addons com layout quebrado: como corrigir

Tipo Page Builders

Nome do erro Layout quebrado da Timeline no Ultimate Addons EN: Ultimate Addons Timeline widget broken layout

Severidade Atenção

Descrição A Timeline do Ultimate Addons fica com layout quebrado quando o CSS do widget não carrega na página, geralmente por cache ou minificacao agressiva, pelo carregamento condicional de assets da UAE, ou por um conflito de CSS do tema sobre a estrutura de colunas do widget.

O que é Timeline Ultimate Addons com layout quebrado?

A Timeline e um widget do Ultimate Addons for Elementor (UAE) que exibe uma linha do tempo, roadmap ou histórico de posts em cartoes alinhados ao longo de um eixo central, com icones, conectores e suporte responsivo de alinhamento. Em telas largas os cartoes alternam de lado do eixo; em telas menores eles empilham e o alinhamento se adapta. Esse arranjo depende inteiramente do CSS próprio do widget, que posiciona o eixo, os conectores e a alternancia esquerda/direita dos cartoes.

O layout quebrado acontece quando esse CSS não chega ao navegador na página renderizada. Sem ele, os cartoes perdem o eixo, empilham em coluna única sem alinhamento, os icones saem de posicao e os conectores somem. Como a Timeline da UAE oferece dois modos, Content Timeline (conteúdo manual com data por item) e Posts Timeline (posts via Query Builder), a quebra aparece igual nos dois: e um problema de entrega de estilo, não de conteúdo.

Como identificar

Os cartoes da Timeline aparecem empilhados em coluna única, todos do mesmo lado, sem o eixo central nem a alternancia esquerda/direita.
Os icones e os conectores entre os pontos da linha do tempo somem ou ficam fora de posicao.
O layout fica correto no editor do Elementor, mas quebra na página publicada vista pelo visitante.
O alinhamento responsivo falha: no celular os itens ficam desalinhados ou sobrepostos em vez de empilhar de forma limpa.
No console do navegador (F12) o arquivo de CSS do Ultimate Addons retorna erro 404 ou não consta na lista de folhas de estilo carregadas.

Antes de começar: Antes de desativar otimizacoes de cache, atualizar plugins ou alterar o CSS em producao, faça um backup completo do site (arquivos e banco de dados) ou teste primeiro em um ambiente de staging, para reverter caso outra página dependa da configuração atual.

Como prevenir

Ao configurar plugins de cache, sempre exclua os arquivos de CSS do Ultimate Addons (caminho ‘/uael/’) da minificacao e da combinacao, evitando que a otimização descarte o estilo do widget.
Valide qualquer mudanca de cache, de versão do Elementor ou de tema em staging antes de publicar, abrindo a página da Timeline como visitante e não apenas no editor.
Mantenha o Ultimate Addons for Elementor e o Elementor sempre na versão estavel mais recente para que markup e CSS do widget permaneçam sincronizados.
Padronize ajustes de estilo da Timeline dentro do próprio widget ou em CSS com classes especificas, evitando regras globais de display/float/flex que atinjam colunas do Elementor.

Causa

Um plugin de cache ou otimização (como WP Rocket ou Autoptimize) minifica e combina o CSS e descarta ou adia a folha de estilo do Ultimate Addons, deixando a Timeline sem as regras de posicionamento do eixo e dos cartoes.
A opção de carregamento condicional de assets do Elementor (Recursos > Configurações > Recursos: 'Improved Asset Loading') so injeta o CSS do widget quando ele e detectado no conteúdo; em templates, popups ou conteúdo montado por shortcode a Timeline renderiza sem o seu CSS.
O cache da página foi servido a partir de uma versão antiga, gerada antes da publicação ou da atualização da UAE, entregando HTML da Timeline sem referenciar a folha de estilo nova do widget.
Uma regra de CSS do tema ou de outro plugin sobrescreve as classes do widget Timeline (por exemplo display, float ou flex aplicados de forma global a colunas), desmontando a alternancia esquerda/direita dos cartoes.
A versão do Ultimate Addons ou do Elementor esta desatualizada e a estrutura de markup do widget mudou, fazendo o CSS em cache não casar mais com as classes presentes no HTML renderizado.

Como resolver

Limpe todos os caches e confirme se o layout volta: Comece pelo mais comum: cache servindo HTML ou CSS antigo. Limpe o cache do plugin de cache, do Elementor e do CDN, depois recarregue a página da Timeline sem cache do navegador para ver se o layout se restabelece.
```
Painel WP -> (seu plugin de cache, ex.: WP Rocket) -> Limpar cache
Painel WP -> Elementor -> Ferramentas -> Regenerar CSS e Dados
Recarregue a página pública com Ctrl + Shift + R (hard refresh)
```
Suspenda a minificacao e a combinacao de CSS no cache: Se a Timeline volta ao normal com o cache desligado, o problema esta na otimização de CSS. Desative temporariamente minificar e combinar CSS para confirmar; depois exclua o CSS do Ultimate Addons da otimização em vez de desligar tudo.
```
Painel WP -> WP Rocket -> Otimização de Arquivos -> desmarque 'Minificar CSS' e 'Combinar CSS'
Salve, limpe o cache e recarregue a página da Timeline
Se resolver, reative a otimização e adicione os arquivos de '/uael/' aos CSS excluidos da minificacao
```
Desligue o carregamento condicional de assets do Elementor: O 'Improved Asset Loading' do Elementor so carrega o CSS do widget onde ele e detectado. Em popups, templates e conteúdo via shortcode a Timeline renderiza sem estilo. Desative essa opção para forcar o carregamento do CSS da UAE em toda página e confirme se o layout volta.
```
Painel WP -> Elementor -> Configurações -> aba Recursos (Features/Experiments)
Localize 'Improved Asset Loading' (Carregamento aprimorado de assets) e defina como Inativo
Salve, limpe o cache do Elementor e recarregue a página da Timeline
```
Atualize Ultimate Addons e Elementor: Markup do widget desatualizado em relacao ao CSS em cache quebra o alinhamento. Atualize o Ultimate Addons for Elementor e o Elementor para as versões estaveis mais recentes e regenere o CSS para alinhar markup e estilo.
```
Painel WP -> Plugins -> atualize 'Ultimate Addons for Elementor' e 'Elementor'
Painel WP -> Elementor -> Ferramentas -> Regenerar CSS e Dados
Limpe o cache do site e recarregue a página
```
Isole um conflito de CSS do tema ou de outro plugin: Se mesmo com o CSS carregando o layout continua torto, ha uma regra global sobrescrevendo o widget. Use o inspetor do navegador sobre um cartao da Timeline para ver qual folha de estilo aplica display, float ou flex indevido, e neutralize a regra com um CSS específico para as classes do widget.
```
Abra a página, clique com o botão direito num cartao da Timeline -> Inspecionar
Na aba Styles, identifique a regra (tema ou plugin) que altera display/float/flex do cartao
Painel WP -> Aparencia -> Personalizar -> CSS Adicional -> adicione a regra de correção específica
```

PHP

<?php
/**
 * Exclui o CSS do Ultimate Addons for Elementor da minificacao do WP Rocket,
 * preservando o estilo do widget Timeline quando a otimizacao esta ativa.
 * Coloque em um plugin de snippets (ex.: Code Snippets), nao no core.
 */
add_filter( 'rocket_exclude_css', 'full_excluir_css_uael' );
function full_excluir_css_uael( $excluded ) {
    $excluded[] = '/wp-content/plugins/header-footer-elementor/(.*).css';
    $excluded[] = '(.*)/uael/(.*).css';
    return $excluded;
}

Perguntas frequentes

Por que a Timeline do Ultimate Addons aparece certa no editor e quebrada na página publicada

No editor o Elementor carrega todos os assets, entao o CSS do widget sempre esta presente. Na página pública, cache, minificacao ou o carregamento condicional de assets podem não entregar a folha de estilo da Timeline, e sem ela o eixo e o alinhamento dos cartoes desmontam.

O WP Rocket pode quebrar o layout da Timeline da UAE

Pode. A minificacao e a combinacao de CSS do WP Rocket as vezes descartam ou adiam a folha de estilo do Ultimate Addons. Desative essas opções para testar e, ao confirmar, exclua os arquivos de '/uael/' da otimização em vez de desligar o recurso inteiro.

O que e o Improved Asset Loading do Elementor e por que afeta a Timeline

E uma opção que carrega o CSS de cada widget apenas onde ele e detectado no conteúdo, para deixar a página mais leve. Em popups, templates e conteúdo via shortcode a Timeline pode renderizar sem o seu CSS. Desative essa opção em Elementor para forcar o carregamento do estilo.

Limpei o cache e a Timeline continua desalinhada, o que faço

Regenere o CSS do Elementor em Ferramentas, atualize o Ultimate Addons e o Elementor e desligue o carregamento condicional de assets. Se o estilo já carrega mas o layout segue torto, use o inspetor do navegador para achar a regra do tema ou plugin que sobrescreve o widget.

Como sei se o CSS do Ultimate Addons esta realmente carregando na página

Abra a página, pressione F12 e va na aba Network ou Sources. Procure pelo arquivo de CSS do Ultimate Addons (geralmente com 'uael' no caminho). Se ele retornar 404 ou não aparecer, o estilo não esta sendo entregue e a Timeline quebra por falta dele.

A Timeline da UAE funciona tanto com conteúdo manual quanto com posts

Sim. O widget tem o modo Content Timeline, com conteúdo e data por item adicionados a mao, e o modo Posts Timeline, que busca posts pelo Query Builder com imagem destacada e data. A quebra de layout afeta os dois modos da mesma forma, pois e um problema de CSS, não de origem do conteúdo.

Preciso editar arquivos do plugin para corrigir o layout da Timeline

Não. A correção se resolve no painel: limpando cache, ajustando a otimização de CSS, desligando o carregamento condicional de assets, atualizando os plugins e, se houver conflito, adicionando CSS específico no Personalizar. Nunca edite arquivos dentro da pasta do Ultimate Addons.

Excluir o CSS da UAE da minificacao deixa o site mais lento

O impacto e mínimo. Você exclui apenas os arquivos do widget que estão quebrando, mantendo a minificacao do restante do CSS. E uma troca pequena de peso por um layout que renderiza corretamente, e mais segura que desativar a otimização inteira.

Grave

Como corrigir o conflito de Header Builder entre Elementor Pro e Astra Pro

O conflito de header entre Elementor Pro e Astra Pro ocorre quando os dois constroem o cabeçalho ao mesmo tempo: o site mostra dois headers empilhados, ou o template de Header do Theme Builder some porque o Astra ainda renderiza o seu. A correção e deixar uma única camada controlar o cabeçalho.

Atenção

Como corrigir o erro do widget Advanced Accordion no Essential Addons

O Essential Addons accordion não funciona quando o elemento Advanced Accordion esta desativado na tela de Elementos do plugin, quando ha conflito com cache ou JavaScript de outro plugin, ou quando o Essential Addons e o Elementor estão desatualizados, impedindo o widget de aparecer no editor ou de abrir no frontend.

Grave

Como corrigir os widgets do Happy Addons que não aparecem com o Crocoblock no WordPress

Os widgets do Happy Addons com o Crocoblock não aparecem quando o Feature Controller desativa os elementos, quando o Elementor exigido está inativo ou desatualizado, ou quando o cache de CSS/JS do Elementor segura a lista antiga de widgets após a instalação do JetPlugins.

Informativo

Como corrigir hover effects do Elementor que não funcionam no Safari

Os hover effects do Elementor não funcionam no Safari quando o navegador serve um arquivo CSS desatualizado, quando a transição depende de uma propriedade que o WebKit exige com prefixo -webkit-, ou quando o efeito é acionado por :hover em um iPhone, onde não existe ponteiro de mouse.

Atenção

Como corrigir os Data Stores do JetEngine que não salvam dados do usuário no WordPress

O JetEngine Data Stores não salva quando o tipo de armazenamento escolhido é por sessao do navegador (Local Storage ou Cookies) e o visitante troca de dispositivo ou limpa o navegador, ou quando o tipo Users esta em uso mas o visitante não esta logado, fazendo os itens adicionados sumirem ao recarregar a página.

Grave

Como corrigir o Flexible Content que não salva layouts no ACF PRO

O Flexible Content que não salva no ACF PRO acontece quando os layouts e seus subcampos viram tantos campos no formulário que o POST ultrapassa o limite max_input_vars do PHP: o WordPress descarta o excedente, o nonce ou os dados não chegam e a atualização do post perde os layouts. A correção é elevar max_input_vars para 10000.

Setores

Extensões

Integrações

Como corrigir o layout quebrado da Timeline no Ultimate Addons no WordPress

O que é Timeline Ultimate Addons com layout quebrado?

Como identificar

Como prevenir

Causa

Como resolver

Perguntas frequentes

Itens relacionados

Como corrigir o conflito de Header Builder entre Elementor Pro e Astra Pro

Como corrigir o erro do widget Advanced Accordion no Essential Addons

Como corrigir os widgets do Happy Addons que não aparecem com o Crocoblock no WordPress

Como corrigir hover effects do Elementor que não funcionam no Safari

Como corrigir os Data Stores do JetEngine que não salvam dados do usuário no WordPress

Como corrigir o Flexible Content que não salva layouts no ACF PRO

Setores

Extensões

Integrações

Extensões

Hero Sections

Seções de CTA

Login

Blog

Cabeçalhos

Seções de FAQ

Cadastro

Blog individual

Rodapés

Seções de contato

Seções de preços

Faixas

Portfólio

Seções de equipe

Números

Logotipos