Dicas e Soluções

O que fazer quando o painel do Magento não carrega CSS e JS

O que fazer quando o painel do Magento não carrega CSS e JS

Quando o painel do Magento não carrega CSS e JS, a interface administrativa pode se tornar praticamente inutilizável, exibindo uma aparência quebrada, com menus desformatados e funcionalidades que não respondem. Esse problema é mais comum do que parece e pode estar relacionado a permissões de arquivos, cache, problemas de compilação ou configurações incorretas do modo de deploy.

Neste artigo, você vai entender por que isso acontece e aprender como resolver o erro com segurança, passo a passo.


Por que o painel do Magento pode falhar no carregamento de CSS e JavaScript?

Quando os arquivos CSS e JS não são carregados corretamente no admin, a experiência do usuário é drasticamente afetada. Os principais motivos incluem:

  • Permissões incorretas nos diretórios pub/static ou var
  • Arquivos estáticos não gerados (compilação ausente ou com erro)
  • Modo de produção mal configurado
  • Configuração incorreta da URL base
  • Cache corrompido ou desatualizado
  • Falta de conteúdo estático nas línguas padrão (ex: pt_BR)

Identificar a causa correta é fundamental para aplicar a solução adequada.


Passo a passo: como resolver quando o painel do Magento não carrega CSS e JS

1. Verifique as permissões de diretórios

O Magento precisa de permissões corretas para gerar e servir arquivos estáticos. Execute os seguintes comandos no terminal da raiz da instalação:

find var vendor pub/static pub/media app/etc -type f -exec chmod 644 {} \;
find var vendor pub/static pub/media app/etc -type d -exec chmod 755 {} \;
chmod u+x bin/magento

Essas permissões garantem que os arquivos CSS e JS possam ser lidos pelo servidor.


2. Limpe o cache e remova arquivos antigos

Arquivos estáticos quebrados ou desatualizados podem causar o problema. Remova os diretórios temporários e recompile:

rm -rf var/cache/*
rm -rf var/page_cache/*
rm -rf pub/static/*
php bin/magento cache:clean
php bin/magento cache:flush

⚠️ Obs.: O diretório pub/static será regenerado automaticamente, exceto pelo arquivo .htaccess, que deve ser mantido. Você pode evitar removê-lo com:

find pub/static -type f ! -name '.htaccess' -delete

3. Recompile os arquivos estáticos

O Magento depende da compilação correta para exibir a interface. Use:

php bin/magento setup:static-content:deploy -f

Inclua o idioma da loja se necessário (ex: pt_BR, en_US):

php bin/magento setup:static-content:deploy pt_BR en_US -f

Essa etapa é fundamental no modo de produção, onde os arquivos não são gerados dinamicamente.


4. Verifique o modo de deploy

Confira em qual modo sua loja está:

php bin/magento deploy:mode:show

Se estiver em developer, o Magento gera CSS e JS automaticamente. No modo production, é necessário usar os comandos de compilação manual (setup:di:compile e static-content:deploy).

Se quiser mudar para developer (por exemplo, em ambiente de testes), use:

php bin/magento deploy:mode:set developer

5. Confirme as URLs base

URLs mal configuradas (como sem HTTPS ou domínio errado) impedem o carregamento de arquivos estáticos. Verifique no banco de dados com:

sqlCopiarEditarSELECT * FROM core_config_data WHERE path LIKE '%base%url%';

Ou via admin:

Stores > Configuration > Web > Base URLs

Assegure-se de que as URLs contenham o domínio correto e estejam usando HTTPS se o SSL estiver habilitado.


6. Verifique erros no console do navegador

Abra o painel administrativo e pressione F12 para abrir o console do navegador. Verifique se há erros como:

  • 403 Forbidden
  • 404 Not Found
  • Mixed content (HTTP e HTTPS)

Essas mensagens podem indicar caminhos incorretos, problemas com permissões ou ausência de arquivos compilados.


Dicas extras para evitar esse problema no futuro

  • Use CDN apenas após testes locais com arquivos estáticos
  • Sempre execute setup:static-content:deploy após atualizações de tema ou idioma
  • Mantenha o cron configurado corretamente para gerar e limpar caches
  • Evite alterações manuais nos diretórios pub/static ou var/

👉 Para problemas de tela branca no admin, veja também:
O que fazer quando o painel do Magento fica em branco


Conclusão: resolvendo falhas de CSS e JS no painel do Magento

Quando o painel do Magento não carrega CSS e JS, é sinal de que algo está errado com o carregamento de arquivos estáticos, permissões ou compilação. Felizmente, com os passos certos — limpar cache, ajustar permissões, compilar conteúdo estático e verificar o modo de deploy — é possível resolver rapidamente.