Product page WooCommerce Astra quebrada: corrigir

Tipo WooCommerce

Nome do erro Página de produto WooCommerce quebrada com Astra Pro EN: WooCommerce product page broken with Astra Pro

Severidade Grave

Descrição A product page do WooCommerce com Astra quebrar significa que a tela do produto abre com layout desalinhado, galeria empilhada ou botão de comprar fora do lugar. Quase sempre vem de template do WooCommerce desatualizado no tema filho, do módulo WooCommerce do Astra Addon desativado ou de um page builder assumindo a single product.

O que é a product page (página de produto) do WooCommerce quebrada com Astra?

A página de produto (single product) e o template que o WooCommerce usa para exibir um produto individual: galeria a esquerda, título, preco, botão de comprar e abas de descrição a direita. O Astra Pro estende essa tela com opções proprias de layout, espacamento e galeria através do módulo WooCommerce do Astra Addon. Quando essa página quebra, o produto continua existindo, mas a tela aparece com a galeria gigante empilhada, colunas coladas, o botão de comprar deslocado ou sem o estilo do Astra, derrubando a conversao porque o cliente não confia numa página visualmente quebrada.

Como identificar

A página do produto abre com a galeria de imagens gigante e empilhada, ocupando a largura toda em vez de ficar lado a lado com o resumo.
Em WooCommerce -> Status, a aba Templates mostra linhas em vermelho com a mensagem ‘version X.Y.Z is out of date. The core version is A.B.C’, indicando template sobrescrito desatualizado.
O botão ‘Comprar agora’ / ‘Adicionar ao carrinho’, o preco ou as abas aparecem fora de ordem, sem o espacamento e o estilo que o Astra normalmente aplica.
As opções de layout de produto somem do Personalizar (Customizer) em Aparencia -> Personalizar -> WooCommerce -> Single Product, sinal de que o módulo do Astra Addon foi desativado.

Antes de começar: Faca backup do tema filho e teste em staging antes de remover a pasta de overrides do WooCommerce numa loja no ar. Se algum override continha customizacao real, guarde a copia (woocommerce-bkp) para reaproveitar a lógica na versão nova do template.

Como prevenir

Depois de cada atualização do WooCommerce, abra WooCommerce -> Status -> Templates e atualize qualquer override marcado em vermelho antes que ele quebre a tela
Mantenha os scripts de galeria do WooCommerce fora da combinacao e do adiamento de JavaScript no plugin de cache
Use um único responsável pela single product: ou o layout nativo do Astra, ou um template do page builder, nunca os dois atribuidos ao mesmo produto
Após mexer no Personalizar do produto, abra um produto como visitante anonimo para confirmar que galeria, preco e botão de comprar continuam alinhados

Causa

Pasta woocommerce dentro do tema filho com templates sobrescritos (content-single-product.php, single-product/ ) numa versão antiga, marcados em vermelho em WooCommerce -> Status -> Templates após um update do WooCommerce.
Módulo 'WooCommerce' desativado em Astra -> Painel (Aparencia -> Astra Options -> Addon), o que remove as opções de Single Product e devolve o layout cru do WooCommerce sem o estilo do Astra.
Page builder (Elementor Pro Theme Builder, Spectra ou Astra Custom Layouts) com um template Single Product publicado e atribuido a todos os produtos, sobrepondo o template do tema.
Galeria do produto sem os scripts flexslider, zoom e photoswipe carregados porque um plugin de cache combinou ou adiou o JavaScript do WooCommerce, deixando as imagens empilhadas.
Opção 'Container Layout' ou 'Sidebar' do produto em Personalizar -> WooCommerce -> Single Product configurada como largura total (full width) enquanto o conteúdo espera duas colunas, colando galeria e resumo.

Como resolver

Cheque os templates desatualizados: abra o painel de status do WooCommerce e veja a aba de templates. Linhas em vermelho apontam arquivos sobrescritos no tema filho que ficaram para tras de uma versão do WooCommerce. Anote os caminhos listados.
```
WooCommerce -> Status -> Templates
```
Remova ou atualize o override antigo: via FTP ou Gerenciador de Arquivos, entre na pasta do tema filho e renomeie a pasta de overrides do WooCommerce para forcar o tema a usar o template padrão novamente. Se você precisa do override, copie a versão nova do plugin por cima.
```
wp-content/themes/astra-child/woocommerce/
mv wp-content/themes/astra-child/woocommerce wp-content/themes/astra-child/woocommerce-bkp
```
Reative o módulo WooCommerce do Astra Addon: no painel do Astra, confirme que o módulo de integração com o WooCommerce esta ligado. Sem ele, o Astra devolve o layout cru e as opções de produto somem do Personalizar.
```
Aparencia -> Astra Options -> Addon -> WooCommerce (ativar)
```
Verifique se um page builder assumiu a single product: procure por um template Single Product publicado no construtor de temas (Theme Builder) ou em Custom Layouts. Um template atribuido a todos os produtos sobrepoe o tema. Desative-o ou ajuste a regra de exibicao para testar a tela limpa.
```
Elementor -> Modelos -> Theme Builder -> Single Product
Astra -> Custom Layouts (regra: Single Product)
```
Libere os scripts da galeria no cache: no plugin de cache, exclua os scripts de galeria do WooCommerce da combinacao e do adiamento de JavaScript, para que zoom, slider e lightbox voltem a montar a galeria em vez de empilhar as imagens.
```
woocommerce/assets/js/flexslider/jquery.flexslider.min.js
woocommerce/assets/js/zoom/jquery.zoom.min.js
woocommerce/assets/js/photoswipe/photoswipe.min.js
```
Ajuste o layout no Personalizar: abra as opções de produto único no Personalizar e confira o container e a sidebar. Volte para o layout padrão com sidebar a direita se a tela tiver sido deixada em largura total por engano, e salve para o Astra reaplicar o espacamento.
```
Aparencia -> Personalizar -> WooCommerce -> Single Product
```

PHP

// functions.php do tema filho — restaura os scripts da galeria do WooCommerce
// na single product quando um plugin de cache os removeu (galeria empilhada com Astra)
add_action( 'wp_enqueue_scripts', function () {
    if ( function_exists( 'is_product' ) && is_product() ) {
        wp_enqueue_script( 'flexslider' );
        wp_enqueue_script( 'zoom' );
        wp_enqueue_script( 'photoswipe-ui-default' );
    }
}, 99 );

// garante o suporte de galeria do tema caso o override antigo o tenha removido
add_action( 'after_setup_theme', function () {
    add_theme_support( 'wc-product-gallery-slider' );
    add_theme_support( 'wc-product-gallery-zoom' );
    add_theme_support( 'wc-product-gallery-lightbox' );
}, 20 );

Perguntas frequentes

A página do produto abriu com a galeria gigante empilhada. Por onde comeco?

Quase sempre e a galeria sem os scripts do WooCommerce: o cache combinou ou adiou o JavaScript e o slider não montou. Exclua os scripts flexslider, zoom e photoswipe da otimização e limpe o cache. Se persistir, cheque templates desatualizados em WooCommerce -> Status.

As opções de layout do produto sumiram do Personalizar do Astra. O que aconteceu?

O módulo de integração do WooCommerce no Astra Addon foi desativado. Sem ele, o Astra devolve o layout cru do WooCommerce e as opções de Single Product desaparecem. Reative o módulo no painel do Astra em Aparencia -> Astra Options -> Addon.

WooCommerce -> Status mostra templates em vermelho. Isso quebra a página do produto?

Sim. Linhas em vermelho são templates sobrescritos no tema filho numa versão antiga. Quando o WooCommerce muda a estrutura desses arquivos, o override velho quebra o layout. Atualize o override para a versão nova ou remova a pasta woocommerce do tema filho.

Uso Elementor Pro. Ele pode estar quebrando o single product do Astra?

Pode. Um template Single Product publicado no Theme Builder do Elementor e atribuido a todos os produtos sobrepoe o layout do tema. Desative ou ajuste a regra de exibicao desse template e teste a tela do produto sem ele para isolar o conflito.

A galeria e o resumo do produto ficaram colados, sem espaco entre eles. Como corrijo?

Confira o container e a sidebar do produto no Personalizar em WooCommerce -> Single Product. Se a tela foi deixada em largura total enquanto o conteúdo espera duas colunas, a galeria e o resumo colam. Volte ao layout padrão com sidebar e salve.

Posso so apagar a pasta woocommerce do tema sem perder nada?

Apagar a pasta woocommerce do tema filho remove os overrides e faz o WooCommerce voltar aos templates padrão. So perde customizacao se você tinha editado esses arquivos. Renomeie a pasta para woocommerce-bkp em vez de apagar, assim guarda a copia para reaproveitar.

Funciona num produto e quebra em outro. O que verificar?

Geralmente e uma regra de exibicao: um Custom Layout do Astra ou um template do page builder atribuido a uma categoria ou a produtos especificos. Compare os dois produtos e veja se o quebrado cai numa regra de template diferente do que funciona.

Atenção

Como corrigir o cupom de desconto que não funciona no WooCommerce

O cupom que não funciona no WooCommerce acontece quando o cliente digita o código de desconto e ele é recusado, não aplica o valor, ou o campo de cupom nem aparece no carrinho. Quase sempre vem dos cupons desativados nas configurações, de restrições de uso (valor mínimo, produtos, validade) ou de cache servindo um carrinho antigo.

Crítico

Como corrigir erro de pagamento do Tutor LMS com WooCommerce

O erro de pagamento do Tutor LMS com WooCommerce ocorre quando o aluno compra um curso, o pedido entra no WooCommerce, mas a matricula não acontece e ele fica sem acesso. A causa quase sempre e o pedido não atingir o status Concluido, o produto do curso não ser virtual, ou a engine de monetizacao errada nas Configurações.

Grave

Como corrigir a exibição de estoque do WooCommerce com o JetEngine

O estoque do WooCommerce aparecer errado no JetEngine significa que o Listing Grid mostra quantidade diferente da real: número desatualizado, zero em produto disponível, ou estoque que não baixa após a venda. Quase sempre vem do Dynamic Field lendo a meta _stock crua em vez do estoque oficial, ou de cache servindo valor antigo.

Grave

Como corrigir carrinho do WooCommerce que esvazia sozinho

O carrinho do WooCommerce que esvazia sozinho acontece quando os itens adicionados desaparecem antes do checkout, derrubando a conversão. A causa quase sempre é cache servindo a página do carrinho em vez de ignorá-la, ou a sessão/cookie do cliente sendo perdida entre as requisições.

Grave

Como corrigir o estoque do WooCommerce mostrando errado

O estoque errado no WooCommerce acontece quando a quantidade exibida não bate com o real: produto disponível aparece esgotado, a contagem não baixa após a venda, ou somem unidades sem pedido. Quase sempre vem de cache antigo, de pedidos presos reduzindo estoque, ou de sincronização externa fora de hora.

Crítico

Como corrigir checkout do WooCommerce que não funciona

O checkout do WooCommerce não funcionar significa que o cliente chega à página de finalizar compra mas não consegue concluir: o botão de finalizar pedido não responde, a página recarrega sem avançar ou retorna erro. Quase sempre vem de conflito de plugin/tema, de requisições AJAX bloqueadas ou da página de checkout configurada errada.

Setores

Extensões

Integrações

Como corrigir a página de produto do WooCommerce que quebra com o Astra Pro

O que é a product page (página de produto) do WooCommerce quebrada com Astra?

Como identificar

Como prevenir

Causa

Como resolver

Perguntas frequentes

Itens relacionados

Como corrigir o cupom de desconto que não funciona no WooCommerce

Como corrigir erro de pagamento do Tutor LMS com WooCommerce

Como corrigir a exibição de estoque do WooCommerce com o JetEngine

Como corrigir carrinho do WooCommerce que esvazia sozinho

Como corrigir o estoque do WooCommerce mostrando errado

Como corrigir checkout do WooCommerce que não funciona

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