Errore “jQuery is not defined” in WordPress: 5 Modi per Risolvere

Se stai vedendo l’errore “jQuery is not defined” nella tua area di amministrazione WordPress (o altrove), non preoccuparti, non sei solo.

Questo è un problema comune che molti utenti WordPress incontrano. Detto questo, può essere frustrante quando il tuo sito non funziona come previsto.

Lavoriamo con WordPress da ben oltre un decennio e, durante questo periodo, abbiamo imparato come risolvere alcuni degli errori WordPress più comuni. Ciò include l’errore “jQuery is not defined”.

In questa guida, discuteremo perché si verifica questo errore e, cosa più importante, come risolverlo.

Spiegheremo tutto in termini semplici, quindi anche se non sei uno sviluppatore, sarai in grado di seguire e risolvere rapidamente il problema.

Comprendere le cause dell’errore “jQuery is not defined” è il primo passo per la soluzione.

Quali sono le cause dell’errore “jQuery is not defined”?

jQuery è una libreria JavaScript ampiamente utilizzata in WordPress che aiuta a eseguire molte funzionalità interattive (animazioni, AJAX, manipolazione del DOM, ecc.).

Tuttavia, a volte, potrebbe non riuscire a caricarsi correttamente, il che potrebbe influire sulla funzionalità del tuo sito web.

L’errore “jQuery is not defined” appare negli strumenti per sviluppatori del browser sotto la scheda Console, quindi molti utenti potrebbero non notarlo finché qualcosa non smette di funzionare sul loro sito (es. un pulsante, un modulo, uno slider).

Se vedi l’errore “jQuery is not defined”, significa che WordPress sta avendo problemi a caricare correttamente questa libreria fondamentale.

Nel corso degli anni, abbiamo aiutato innumerevoli utenti a risolvere questo problema e abbiamo imparato che di solito deriva da alcune cause comuni:

1. Temi o plugin obsoleti: Molti utenti riscontrano questo errore quando i loro temi o plugin non sono aggiornati per essere compatibili con l’ultima versione di WordPress o con la versione di jQuery inclusa nel core. Lo abbiamo visto accadere spesso dopo importanti aggiornamenti di WordPress.
2. Caricamento improprio degli script: jQuery deve essere caricato prima di altri file JavaScript che dipendono da esso. Se non lo è, gli script che dipendono da jQuery si romperanno. Ciò si verifica spesso se temi o plugin non sono codificati correttamente per accodare (enqueue) gli script nel giusto ordine e con le giuste dipendenze.
3. Conflitti JavaScript: Altri script in esecuzione sul tuo sito potrebbero entrare in conflitto con jQuery, specialmente se non sono caricati correttamente o usano variabili con nomi simili. Questo conflitto può “rompere” jQuery, causando l’errore “jQuery is not defined”.
4. Errori CDN: Alcuni siti si affidano a jQuery ospitato su una Content Delivery Network (CDN) esterna (come Google Hosted Libraries). Se la CDN non è disponibile, è bloccata (ad esempio da un firewall o ad-blocker) o il link è errato, il sito non sarà in grado di caricare jQuery, provocando l’errore.
5. Problemi di concatenazione/minificazione: Plugin di ottimizzazione delle prestazioni che combinano (concatenano) o minimizzano i file JavaScript potrebbero, in alcuni casi, alterare l’ordine di caricamento o introdurre errori che impediscono a jQuery di funzionare correttamente.

Tutti questi problemi possono impedire a jQuery di funzionare senza intoppi. Ma non preoccuparti: con la nostra esperienza, possiamo guidarti attraverso le soluzioni per risolvere il problema.

Come risolvere l’errore “jQuery is not defined”

Ci sono diversi modi per correggere questo errore quando lo incontri. Di seguito sono riportati i metodi più efficaci che abbiamo utilizzato per risolvere questo problema.

Ti consigliamo di provare queste strategie in ordine, ma puoi utilizzare i link rapidi qui sotto se desideri iniziare con uno in particolare:

1. Aggiorna WordPress, Temi e Plugin
2. Verifica se jQuery è Caricato Correttamente
3. Aggiungi un Fallback per jQuery
4. Correggi l’Ordine di Caricamento degli Script (Avanzato)
5. Modifica wp-config.php per Risolvere Problemi di Caricamento jQuery

Esamineremo ciascuno di questi metodi e poi ti forniremo alcune risorse extra per la risoluzione degli errori di WordPress. Iniziamo!

1. Aggiorna WordPress, temi e plugin

Il software obsoleto è una delle cause più comuni dell’errore “jQuery is not defined”. Temi o plugin obsoleti potrebbero non essere compatibili con l’ultima versione di WordPress o con le librerie JavaScript aggiornate, il che può provocare conflitti di script. Per risolvere questo:

Innanzitutto, assicurati che il tuo core WordPress sia aggiornato. Vai su Bacheca » Aggiornamenti e fai clic su “Aggiorna alla versione X.X.X” se è disponibile un aggiornamento.

Gli aggiornamenti dei tuoi plugin WordPress saranno elencati sotto l’aggiornamento del core. Puoi selezionarli tutti e fare clic su “Aggiorna plugin“.

Infine, vedrai gli aggiornamenti per i tuoi temi WordPress. Selezionali semplicemente tutti e fai clic su “Aggiorna temi“.

Se sei preoccupato per le modifiche che hai apportato al tuo tema, segui la nostra guida su come aggiornare il tuo tema WordPress senza perdere le personalizzazioni (idealmente, dovresti usare un tema child).

2. Verifica se jQuery è caricato correttamente

Prima di esplorare soluzioni più avanzate, è importante verificare se jQuery viene effettivamente caricato sul tuo sito.

Questo passaggio ti aiuta a confermare se jQuery è disponibile e funziona come dovrebbe, oppure se il problema è proprio la sua assenza, causa principale dell’errore “jQuery is not defined”.

Fai semplicemente clic con il pulsante destro del mouse in un punto qualsiasi del tuo sito WordPress e seleziona “Visualizza sorgente pagina” (o simile, a seconda del browser).

Suggerimento: In alternativa, puoi premere Ctrl + U su Windows o Cmd + Option + U su Mac per accedere al sorgente della pagina.

Questo ti mostrerà l’HTML e il JavaScript grezzi per la tua pagina.

Successivamente, premi Ctrl + F (o Cmd + F su Mac) per visualizzare la barra di ricerca e digita jquery.min.js o semplicemente jquery.js.

Se jQuery viene caricato correttamente, dovresti vedere un riferimento ad esso nel codice, tipicamente all’interno di un tag <script src="...">.

Un altro modo per cercare jQuery è utilizzare lo strumento Ispeziona del tuo browser. Vai semplicemente alla scheda “Rete” (o “Network“) e ricarica la pagina.

Suggerimento: Su un dispositivo Windows, puoi accedere allo strumento Ispeziona premendo F12 sulla tastiera. Per Mac, premi Option + Cmd + I.

Filtra l’attività di rete digitando jquery nella barra di ricerca. Se jQuery viene caricato, lo vedrai elencato qui (spesso con uno stato HTTP 200 OK).

Se non vedi jQuery caricato con nessuno dei due metodi, il problema potrebbe essere il modo in cui viene accodato (enqueued) in WordPress.

Nei passaggi successivi, ti guideremo attraverso la correzione di questo.

3. Aggiungi un fallback per jQuery

A volte, uno script sul tuo sito potrebbe caricare jQuery utilizzando una CDN (Content Delivery Network) esterna che sta riscontrando problemi di connettività o è bloccata. In tal caso, non riuscirebbe a caricare jQuery e causerebbe l’errore “jQuery is not defined”.

Per risolvere il problema, puoi aggiungere un fallback jQuery al tuo sito WordPress. Ciò garantisce che se la CDN fallisce, jQuery venga comunque caricato dalla versione inclusa in WordPress.

È necessario aggiungerlo nella sezione <head> del tuo sito per assicurarsi che venga caricato presto. Tuttavia, non consigliamo di modificare direttamente i file del tema. Abbiamo visto persone perdere le modifiche durante l’aggiornamento del tema.

Il modo migliore per aggiungere codice personalizzato in WordPress è utilizzare il plugin WPCode. È un gestore di snippet di codice che ti consente di aggiungere codice personalizzato in modo sicuro senza rompere il tuo sito.

Innanzitutto, installa e attiva il plugin WPCode. Per maggiori dettagli, consulta il nostro tutorial sull’installazione di un plugin per WordPress.

Nota: è disponibile anche una versione gratuita chiamata WPCode Lite.

Una volta attivato, vai su Code Snippets » + Add Snippet. Quindi, fai clic sul pulsante “Use snippet” sotto “Add Your Custom Code (New Snippet)“.

Nell’editor del codice, assegna un nome al tuo snippet, ad esempio “Fallback jQuery“.

Successivamente, seleziona “HTML Snippet” come “Code Type“.

Quindi, incolla il seguente codice nella casella “Code Preview“:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script> <!-- Nota: usa una versione recente ma stabile -->
<script>
   window.jQuery || document.write('<script src="<?php echo includes_url( '/js/jquery/jquery.js' ); ?>"><\/script>')
</script>

Ora, indica a WPCode dove caricare questo codice. Assicurati di selezionare “Site Wide Header” sotto “Location” nella sezione “Insertion“.

Infine, fai clic sul pulsante “Save Snippet” in alto per salvare il tuo codice personalizzato.

Dopodiché, non dimenticare di attivare lo snippet portando l’interruttore su “Active“.

4. Correggi l’ordine di caricamento degli Script (Avanzato)

Un altro motivo comune per l’errore “jQuery is not defined” è che jQuery viene caricato dopo altri script che si basano su di esso. Correggere l’ordine di caricamento degli script assicura che jQuery venga sempre caricato prima, prevenendo conflitti.

Questo metodo è più tecnico e richiede di identificare quale script sta causando il problema.

Se sai quale script si basa su jQuery ma viene caricato prima (o senza dichiarare la dipendenza), puoi accodare correttamente quello script aggiungendo jQuery come dipendenza.

Il modo corretto per aggiungere script e stili in WordPress è tramite le funzioni wp_enqueue_script() e wp_enqueue_style(), solitamente all’interno del file functions.php del tema (o meglio, tramite un plugin come WPCode).

Se l’errore “jQuery is not defined” è causato dal caricamento di jQuery dopo altri script che ne dipendono, puoi correggere l’ordine di caricamento degli script utilizzando WPCode.

Innanzitutto, installa e attiva il plugin WPCode, o utilizza la versione gratuita WPCode Lite.

Una volta attivato, vai su Code Snippets » + Add Snippet e fai clic sul pulsante “Use snippet” sotto “Add Your Custom Code (New Snippet)“.

Nell’editor del codice, assegna un nome al tuo snippet, ad esempio “Correggi Ordine Script X” e seleziona “PHP Snippet” come tipo di codice.

Quindi, aggiungi il seguente codice (o modifica l’accodamento esistente dello script problematico) per assicurarti che jQuery sia accodato come dipendenza per qualsiasi script personalizzato:

function mio_tema_enqueue_scripts() {
   // Accoda lo script personalizzato dichiarando jQuery come dipendenza
   wp_enqueue_script( 'mio-script-handle', get_template_directory_uri() . '/js/mio-script.js', array( 'jquery' ), '1.0', true );
   // ^^^^^^^^^^ Qui dichiari la dipendenza
}
add_action( 'wp_enqueue_scripts', 'mio_tema_enqueue_scripts' )

Non dimenticare di sostituire ‘mio-script-handle‘ con un nome significativo per identificare lo script e sostituisci ‘/js/mio-script.js‘ con il nome effettivo del file dello script nella cartella /js/ (o ovunque sia) del tuo tema.

La parte array('jquery') nel codice assicura che WordPress carichi jQuery prima di caricare mio-script.js. L’ultimo parametro true indica di caricare lo script nel footer, che è generalmente una buona pratica per le prestazioni, a meno che lo script non debba essere eseguito nell’head.

Una volta aggiunto il codice, scorri verso il basso fino alle opzioni di “Insertion” e seleziona “Auto Insert” e “Site Wide Header” (o “Frontend Footer” se hai usato true come ultimo parametro in wp_enqueue_script).

Infine, fai clic sul pulsante “Save Snippet” in alto per salvare il tuo codice personalizzato.

Dopodiché, non dimenticare di attivare lo snippet portando l’interruttore su “Active“.

Utilizzare WPCode per accodare correttamente gli script assicura che jQuery venga caricato nell’ordine corretto.

Se questa era la radice del problema, dovrebbe risolvere l’errore “jQuery is not defined”.

5. Modifica wp-config.php per risolvere problemi di caricamento jQuery

Se gli altri metodi non hanno funzionato, la modifica del file wp-config.php può aiutare controllando come WordPress gestisce il caricamento degli script.

Questo metodo è utile se problemi di concatenazione degli script o di percorso dei file stanno causando l’errore “jQuery is not defined”.

Questa è una soluzione meno comune ma può essere efficace in determinate circostanze.

Ecco come applicare questo metodo:

Innanzitutto, accedi al tuo file wp-config.php. Puoi farlo utilizzando un client FTP come FileZilla o accedendo al file manager nel pannello di controllo del tuo hosting.

Il file wp-config.php si trova nella directory principale della tua installazione di WordPress (solitamente nella cartella public_html).

Una volta individuato il file, crea un backup prima di modificarlo.

Aprilo per la modifica e aggiungi il seguente codice appena prima della riga che dice /* That's all, stop editing! Happy publishing. */:

/** Disabilita la concatenazione degli script */
define('CONCATENATE_SCRIPTS', false)

Ecco cosa fa questo codice:

• La linea define('CONCATENATE_SCRIPTS', false); disabilita la concatenazione degli script. Per impostazione predefinita, WordPress cerca di combinare più file CSS e JS in meno file per migliorare le prestazioni. Tuttavia, a volte questo processo può causare conflitti o rompere la dipendenza da jQuery. Disabilitandolo, si forza WordPress a caricare ogni script separatamente, il che può prevenire conflitti derivanti dalla fusione degli script e potenzialmente risolvere l’errore “jQuery is not defined”.

Dopo aver aggiunto questo codice, salva le modifiche e ricarica il tuo sito per vedere se l’errore è stato risolto.

Disabilitare la concatenazione degli script può essere una soluzione semplice ma efficace per i problemi di jQuery, specialmente quando altri metodi non funzionano, anche se potrebbe avere un leggero impatto sulle prestazioni (solitamente trascurabile).

Risorse bonus: risoluzione errori WordPress

Se tutti i passaggi precedenti non aiutano o desideri leggere ulteriormente, le seguenti risorse potrebbero essere buoni punti di partenza:

• Guida per principianti alla risoluzione degli errori di WordPress (passo dopo passo)
• Come aggiungere correttamente JavaScript e stili in WordPress
• Come correggere JavaScript e CSS che bloccano il rendering in WordPress

Speriamo che questo articolo ti abbia aiutato a correggere l’errore “jQuery is not defined” in WordPress.

Se questo articolo vi è piaciuto, seguiteci su X e Facebook per rimanere aggiornati su tutte le novità e consigli utili su WordPress!