Como Corrigir Erro de WordPress ‘jQuery is not defined’ (6 Maneiras)

Quando algo quebra no WordPress, pode parecer que você bateu em uma parede, especialmente quando a mensagem de erro não faz muito sentido. Um desses problemas crípticos é o temido erro 'jQuery is not defined'.

Vimos isso aparecer em tudo, desde formulários de contato até sliders de imagem que de repente se recusam a funcionar. Geralmente pega os usuários de surpresa, especialmente se você não estiver verificando ativamente o console do navegador.

Ajudamos inúmeros proprietários de sites a corrigir exatamente esse problema. E a melhor parte? Você não precisa ser um desenvolvedor para acompanhar.

Neste guia, explicaremos o que o erro significa, por que ele acontece e o guiaremos pelas correções passo a passo que realmente funcionam, mesmo que você nunca tenha tocado em uma linha de código antes.

O que Causa o Erro 'jQuery is not defined'?

jQuery é uma biblioteca JavaScript amplamente utilizada no WordPress que ajuda a executar muitos recursos interativos. No entanto, às vezes, ela pode não carregar corretamente, o que pode afetar a funcionalidade do seu site.

O erro aparece nas ferramentas do desenvolvedor na aba Console, então muitos usuários podem não notá-lo até que algo quebre em seu site.

Se você vir o erro 'jQuery is not defined', isso significa que o WordPress está tendo problemas para carregá-lo corretamente. Ao longo dos anos, ajudamos inúmeros usuários a corrigir esse problema e aprendemos que ele geralmente decorre de algumas causas comuns:

1. Temas ou Plugins Desatualizados: Muitos usuários encontram este erro quando seus temas ou plugins não estão atualizados para corresponder à versão mais recente do WordPress. Frequentemente vimos isso acontecer após grandes atualizações do WordPress.
2. Carregamento Incorreto de Scripts: O jQuery deve ser carregado antes de outros arquivos JavaScript. Se não for, scripts que dependem do jQuery quebrarão. Isso geralmente ocorre se temas ou plugins não forem codificados corretamente para enfileirar scripts.
3. Conflitos de JavaScript: Outros scripts em execução em seu site podem entrar em conflito com o jQuery, especialmente se não forem carregados corretamente. Esse conflito pode quebrar o jQuery, causando o erro.
4. Falhas na CDN: Alguns sites dependem do jQuery hospedado em uma Rede de Distribuição de Conteúdo (CDN). Se a CDN estiver indisponível ou bloqueada, o site não conseguirá carregar o jQuery, resultando no erro.

Todos esses problemas podem impedir que o jQuery funcione corretamente. Mas não se preocupe – com nossa experiência, podemos guiá-lo pelas soluções para resolver o problema.

Como Corrigir o Erro 'jQuery is not defined'

Existem várias maneiras de corrigir este erro quando você o encontrar. Abaixo estão os métodos mais eficazes que usamos para corrigir este problema.

Recomendamos tentar essas estratégias em ordem, mas você pode usar os links de salto abaixo se quiser começar com um específico:

• Atualize o WordPress, Temas e Plugins
• Verifique se o jQuery está Carregado Corretamente
• Adicione um Fallback de jQuery
• Corrija a Ordem de Carregamento de Scripts (Avançado)
• Edite o wp-config.php para Corrigir Problemas de Carregamento do jQuery
• Perguntas Frequentes sobre o Erro 'jQuery is not defined'
• Recursos Bônus: Solução de Problemas de Erros do WordPress

Abordaremos cada um desses métodos e, em seguida, forneceremos alguns recursos extras para a solução de problemas de erros do WordPress. Vamos lá!

1. Atualize o WordPress, Temas e Plugins

Software desatualizado é uma das causas mais comuns do erro ‘jQuery is not defined’. Temas ou plugins desatualizados podem não ser compatíveis com a versão mais recente do WordPress, o que pode resultar em conflitos de script. Para corrigir isso:

Primeiro, certifique-se de que o núcleo do seu WordPress está atualizado. Navegue até Painel » Atualizações e clique em ‘Atualizar para a versão X.X.X’ se uma atualização estiver disponível.

Veja nosso guia completo sobre como atualizar o WordPress com segurança para uma nova versão para mais detalhes.

As atualizações dos seus plugins do WordPress serão listadas abaixo da atualização principal.

Você pode selecionar todos eles e clicar em ‘Atualizar Plugins’.

Por último, você verá as atualizações para os seus temas do WordPress.

Simplesmente selecione todos eles e clique em ‘Atualizar Temas’.

Se você estiver preocupado com as alterações que fez no seu tema, siga nosso guia sobre como atualizar seu tema do WordPress sem perder customizações.

2. Verifique se o jQuery está sendo carregado corretamente

Antes de explorar soluções mais avançadas, é importante verificar se o jQuery está realmente sendo carregado no seu site. Esta etapa ajuda você a confirmar se o jQuery está disponível e funcionando como deveria.

Simplesmente clique com o botão direito em qualquer lugar do seu site WordPress e selecione ‘Exibir código fonte da página’.

Isso mostrará o HTML e JavaScript brutos da sua página.

Em seguida, pressione Ctrl + F (ou Cmd + F no Mac) para abrir a barra de pesquisa e digite ‘jquery.min.js’.

Se o jQuery estiver carregado corretamente, você deverá ver uma referência a ele no código.

Outra maneira de procurar pelo jQuery é usar a Ferramenta de Inspeção do seu navegador. Simplesmente vá para a aba ‘Network’ e recarregue a página.

Filtre a atividade da rede digitando ‘jquery’ na barra de pesquisa. Se o jQuery for carregado, você o verá listado aqui.

Se você não vir o jQuery carregado em nenhum dos métodos, o problema pode ser como ele está sendo enfileirado no WordPress. Nas próximas etapas, orientaremos você na correção disso.

3. Adicione um Fallback de jQuery

Às vezes, um script em seu site pode estar carregando o jQuery usando uma CDN que está tendo problemas de conectividade. Nesse caso, ele falharia ao carregar o jQuery e causaria o erro.

Para corrigir o problema, você pode adicionar um fallback de jQuery ao seu site WordPress. Isso garante que o jQuery seja sempre carregado.

Você precisa adicioná-lo à seção do seu site para garantir que ele carregue primeiro. No entanto, não recomendamos editar os arquivos do tema diretamente. Já vimos pessoas perderem suas alterações ao atualizar o tema e o código que adicionaram.

A melhor maneira de adicionar código personalizado no WordPress é usar o plugin WPCode. É um gerenciador de trechos de código que permite adicionar código personalizado com segurança sem quebrar seu site.

Primeiro, instale e ative o plugin WPCode. Para detalhes, veja nosso tutorial sobre como instalar um plugin do WordPress.

Uma vez ativado, vá para Snippets de Código » + Adicionar Snippet. Em seguida, clique no botão ‘Usar snippet’ em ‘Adicionar Seu Código Personalizado (Novo Snippet).’

No editor de código, dê um nome ao seu snippet como ‘jQuery Fallback.’

Depois disso, selecione ‘Snippet HTML’ para o ‘Tipo de Código.’

Em seguida, cole o seguinte código na caixa ‘Pré-visualização do Código:’

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
    window.jQuery || document.write('<script src="/wp-includes/js/jquery/jquery.js"><\/script>')
</script>

Em seguida, role para baixo até a seção ‘Inserção.’

Aqui, você pode dizer ao WPCode onde carregar este código. Certifique-se de selecionar ‘Cabeçalho do Site Inteiro.’

Por fim, clique no botão ‘Salvar Snippet’ no topo para salvar seu código personalizado.

Depois disso, não se esqueça de ativar o snippet mudando o interruptor para ‘Ativo’.

4. Corrigir Ordem de Carregamento de Scripts (Avançado)

Outro motivo comum para o erro ‘jQuery não está definido’ é que o jQuery está carregando depois de outros scripts que dependem dele. Corrigir a ordem de carregamento de scripts garante que o jQuery seja sempre carregado primeiro, evitando conflitos.

Se você souber qual script depende do jQuery, pode enfileirar esse script corretamente adicionando o jQuery como uma dependência.

Se o erro ‘jQuery não está definido’ for causado pelo carregamento do jQuery após outros scripts que dependem dele, você pode corrigir a ordem de carregamento de scripts usando o WPCode.

Primeiro, instale e ative o plugin WPCode, ou opte pela versão gratuita chamada WPCode Lite.

Uma vez ativado, vá para Code Snippets » + Add Snippet e clique no botão ‘Use snippet’ em ‘Add Your Custom Code (New Snippet)’.

No editor de código, dê um nome ao seu snippet como ‘Fix Script Loading Order’ e selecione ‘PHP snippet’ como seu tipo de código.

Em seguida, adicione o seguinte código para garantir que o jQuery seja enfileirado como uma dependência para quaisquer scripts personalizados:

wp_enqueue_script( 'your-script-handle', get_template_directory_uri() . '/js/your-script.js', array( 'jquery' ), null, true );

Não se esqueça de substituir ‘your-script-handle’ por um nome significativo para identificar o script. E substitua ‘/js/your-script.js’ pelo nome real do arquivo de script na pasta /js/ do seu tema.

A parte array('jquery') no código garante que o jQuery seja carregado primeiro.

Depois de adicionar o código, role para baixo até as opções de ‘Inserção’ e selecione ‘Cabeçalho em todo o site’ para garantir que o script seja carregado na parte correta do HTML do seu site.

Por fim, clique no botão ‘Salvar Snippet’ no topo para salvar seu código personalizado.

Depois disso, não se esqueça de ativar o snippet mudando o interruptor para ‘Ativo’.

Usar o WPCode para enfileirar scripts corretamente garante que o jQuery seja carregado na ordem correta. Se esse era o motivo do problema, isso deve resolver o erro.

5. Edite o wp-config.php para Corrigir Problemas de Carregamento do jQuery

Se os outros métodos não funcionaram, editar o arquivo wp-config.php pode ajudar controlando como o WordPress lida com o carregamento de scripts.

Este método é útil se problemas de concatenação de scripts ou de caminhos de arquivo estiverem causando o erro ‘jQuery is not defined’.

Veja como aplicar este método:

Primeiro, acesse seu arquivo wp-config.php. Você pode fazer isso usando um cliente FTP como o FileZilla ou acessando o gerenciador de arquivos no painel de controle da sua hospedagem.

O arquivo wp-config.php está localizado no diretório raiz da sua instalação do WordPress (geralmente na pasta public_html).

Depois de localizar o arquivo, abra-o para edição e adicione o seguinte código logo antes da linha que diz /* Isso é tudo, pare de editar! Bom blog. */:

/** Absolute path to the WordPress directory. */
if ( !defined('ABSPATH') )
define('ABSPATH', dirname(FILE) . '/');
define('CONCATENATE_SCRIPTS', false);

Veja o que este código faz:

• A definição ABSPATH garante que o WordPress saiba o caminho correto para seus arquivos principais, o que pode prevenir problemas de carregamento do jQuery.
• A linha CONCATENATE_SCRIPTS desabilita a concatenação de scripts. Isso força o WordPress a carregar cada script separadamente, prevenindo conflitos que surgem quando os scripts são mesclados.

Após adicionar este código, salve suas alterações e recarregue seu site para ver se o erro foi resolvido.

Desabilitar a concatenação de scripts pode ser uma correção simples, mas eficaz para problemas do jQuery, especialmente quando outros métodos não funcionam.

Perguntas Frequentes Sobre o Erro ‘jQuery is not defined’

Recursos Bônus: Solução de Problemas de Erros do WordPress

Se todos os passos acima não ajudarem ou se você quiser ler mais, os seguintes recursos podem ser bons pontos de partida:

• Guia para Iniciantes sobre Solução de Problemas de Erros no WordPress (Passo a Passo)
• Como Adicionar Scripts e Estilos Corretamente no WordPress
• Erros Mais Comuns do WordPress e Como Corrigi-los
• Como Corrigir JavaScript e CSS que Bloqueiam a Renderização no WordPress

Esperamos que este artigo tenha ajudado você a corrigir o erro 'jQuery is not defined' no WordPress. Você também pode querer ver nosso guia sobre como atualizar o jQuery para a versão mais recente no WordPress ou nossa seleção dos melhores tutoriais de jQuery para iniciantes no WordPress.

Se você gostou deste artigo, por favor, inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.