När något går sönder i WordPress kan det kännas som att slå i en vägg, särskilt när felmeddelandet inte är särskilt begripligt. Ett av dessa kryptiska problem är det fruktade felmeddelandet 'jQuery is not defined'.
Vi har sett detta dyka upp på allt från kontaktformulär till bildreglage som plötsligt vägrar att fungera. Det överraskar vanligtvis användare, särskilt om du inte aktivt kontrollerar webbläsarkonsolen.
Vi har hjälpt otaliga webbplatsägare att fixa exakt detta problem. Och det bästa? Du behöver inte vara utvecklare för att följa med.
I den här guiden förklarar vi vad felet betyder, varför det uppstår och guidar dig genom steg-för-steg-lösningar som faktiskt fungerar, även om du aldrig har rört en kodrad tidigare.
Vad orsakar felet ‘jQuery is not defined’?
jQuery är ett allmänt använt JavaScript-bibliotek i WordPress som hjälper till att köra många interaktiva funktioner. Ibland kan det dock misslyckas med att laddas korrekt, vilket kan påverka din webbplats funktionalitet.
Felet visas i utvecklarverktygen under fliken Konsol, så många användare kanske inte märker det förrän något går sönder på deras webbplats.
Om du ser felet 'jQuery is not defined' betyder det att WordPress har problem med att ladda det korrekt. Under åren har vi hjälpt otaliga användare att lösa detta problem, och vi har lärt oss att det vanligtvis beror på några vanliga orsaker:
- Föråldrade teman eller plugins: Många användare stöter på detta fel när deras teman eller plugins inte är uppdaterade för att matcha den senaste versionen av WordPress. Vi har ofta sett detta hända efter stora WordPress-uppdateringar.
- Felaktig laddning av skript: jQuery måste laddas före andra JavaScript-filer. Om det inte gör det kommer skript som är beroende av jQuery att sluta fungera. Detta inträffar ofta om teman eller plugins inte är korrekt kodade för att lägga till skript.
- JavaScript-konflikter: Andra skript som körs på din webbplats kan komma i konflikt med jQuery, särskilt om de inte laddas korrekt. Denna konflikt kan bryta jQuery och orsaka felet.
- CDN-fel: Vissa webbplatser förlitar sig på jQuery som är hostat på ett Content Delivery Network (CDN). Om CDN:et är otillgängligt eller blockerat, kan webbplatsen inte ladda jQuery, vilket resulterar i felet.
Alla dessa problem kan förhindra att jQuery körs smidigt. Men oroa dig inte – med vår erfarenhet kan vi guida dig genom lösningarna för att lösa problemet.
Hur man fixar felet 'jQuery är inte definierat'
Det finns flera sätt att åtgärda detta fel när du stöter på det. Nedan följer de mest effektiva metoderna vi har använt för att lösa detta problem.
Vi rekommenderar att du provar dessa strategier i ordning, men du kan använda hopplänkarna nedan om du vill börja med en specifik:
- Uppdatera WordPress, teman och plugins
- Kontrollera om jQuery laddas korrekt
- Lägg till en jQuery-återställning
- Åtgärda laddningsordningen för skript (avancerat)
- Redigera wp-config.php för att åtgärda problem med jQuery-laddning
- Vanliga frågor om felet 'jQuery is not defined'
- Bonusresurser: Felsökning av WordPress-fel
Vi kommer att gå igenom var och en av dessa metoder och sedan ge dig några extra resurser för felsökning av WordPress-fel. Nu kör vi!
1. Uppdatera WordPress, teman och plugins
Föråldrad programvara är en av de vanligaste orsakerna till felet 'jQuery är inte definierat'. Föråldrade teman eller plugins kanske inte är kompatibla med den senaste versionen av WordPress, vilket kan leda till skriptkonflikter. För att åtgärda detta:
Kontrollera först att din WordPress-kärna är uppdaterad. Navigera till Instrumentpanel » Uppdateringar och klicka på 'Uppdatera till version X.X.X' om en uppdatering är tillgänglig.
Se vår kompletta guide om hur du säkert uppdaterar WordPress till en ny version för mer information.
Dina WordPress-pluginuppdateringar kommer att listas under kärnuppdateringen.
Du kan välja alla och klicka på 'Uppdatera plugins'.
Slutligen kommer du att se uppdateringar för dina WordPress-teman.
Välj helt enkelt alla och klicka på 'Uppdatera teman'.
Om du är orolig för ändringarna du har gjort i ditt tema, följ vår guide om hur du uppdaterar ditt WordPress-tema utan att förlora anpassningar.
2. Kontrollera om jQuery laddas korrekt
Innan du utforskar mer avancerade lösningar är det viktigt att kontrollera om jQuery faktiskt laddas på din webbplats. Detta steg hjälper dig att bekräfta om jQuery är tillgängligt och fungerar som det ska.
Högerklicka helt enkelt var som helst på din WordPress-webbplats och välj 'Visa sidkälla'.
Tips: Alternativt kan du trycka på Ctrl + U på Windows eller Cmd + Option + U på Mac för att komma åt sidans källkod.
Detta visar dig den råa HTML- och JavaScript-koden för din sida.
Tryck sedan på Ctrl +F (eller Cmd + F på Mac) för att öppna sökfältet och skriv in ‘jquery.min.js.’
Om jQuery laddas korrekt bör du se en referens till det i koden.
Ett annat sätt att leta efter jQuery är att använda din webbläsares Inspektera verktyg. Gå helt enkelt till fliken ‘Nätverk’ och ladda om sidan.
Tips: På en Windows-enhet kan du komma åt Inspektera-verktyget genom att trycka på F12 på tangentbordet. För Mac, tryck på Alternativ + Cmd + I.
Filtrera nätverksaktiviteten genom att skriva ‘jquery’ i sökfältet. Om jQuery laddas, kommer du att se det listat här.
Om du inte ser jQuery laddas i någon av metoderna, kan problemet vara hur det är registrerat i WordPress. I följande steg guidar vi dig genom att åtgärda detta.
3. Lägg till en jQuery-återställning
Ibland kan ett skript på din webbplats ladda jQuery med hjälp av en CDN som har anslutningsproblem. I så fall skulle det misslyckas med att ladda jQuery och orsaka felet.
För att åtgärda problemet kan du lägga till en jQuery-återställning på din WordPress-webbplats. Detta säkerställer att jQuery alltid laddas.
Du måste lägga till den i webbplatsens sidhuvud för att säkerställa att den laddas först. Vi rekommenderar dock inte att redigera temafiler direkt. Vi har sett folk förlora sina ändringar när de uppdaterar temat och koden de lade till.
Det bästa sättet att lägga till anpassad kod i WordPress är att använda WPCode-pluginet. Det är en kodhanterare som gör det möjligt att lägga till anpassad kod säkert utan att förstöra din webbplats.
Installera och aktivera först pluginet WPCode. För detaljer, se vår handledning om hur man installerar ett WordPress-plugin.
Observera: Det finns också en gratisversion tillgänglig som heter WPCode Lite.
När den är aktiverad, gå till Kodutdrag » + Lägg till utdrag. Klicka sedan på knappen ‘Använd utdrag’ under ‘Lägg till din anpassade kod (nytt utdrag).’
I kodredigeraren, ge ditt kodavsnitt ett namn som ‘jQuery Fallback.’
Välj därefter ‘HTML-utdrag’ för ‘Kodtyp.’
Klistra sedan in följande kod i rutan 'Code Preview':
<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>
Rulla sedan ner till avsnittet 'Insertion'.
Här kan du tala om för WPCode var den här koden ska laddas. Se till att du väljer ‘Hela webbplatsens sidhuvud.’
Klicka slutligen på knappen ‘Spara utdrag’ högst upp för att spara din anpassade kod.
Glöm sedan inte att aktivera kodavsnittet genom att växla reglaget till 'Aktiv'.
4. Åtgärda laddningsordningen för skript (avancerat)
En annan vanlig orsak till felet 'jQuery är inte definierat' är att jQuery laddas efter andra skript som är beroende av det. Att åtgärda laddningsordningen för skript säkerställer att jQuery alltid laddas först, vilket förhindrar konflikter.
Om du vet vilket skript som är beroende av jQuery kan du köa det skriptet korrekt genom att lägga till jQuery som en beroende.
Om felet 'jQuery är inte definierat' orsakas av att jQuery laddas efter andra skript som är beroende av det, kan du åtgärda laddningsordningen för skript med WPCode.
Installera och aktivera först pluginet WPCode, eller välj gratisversionen som heter WPCode Lite.
När det har aktiverats, gå till Kodavsnitt » + Lägg till avsnitt och klicka på knappen 'Använd avsnitt' under 'Lägg till din anpassade kod (nytt avsnitt)'.
I kodredigeraren, ge ditt kodavsnitt ett namn som 'Fix Script Loading Order' och välj 'PHP snippet' som kodtyp.
Lägg sedan till följande kod för att säkerställa att jQuery laddas som ett beroende för alla anpassade skript:
wp_enqueue_script( 'your-script-handle', get_template_directory_uri() . '/js/your-script.js', array( 'jquery' ), null, true );
Glöm inte att ersätta ‘your-script-handle’ med ett meningsfullt namn för att identifiera skriptet. Och ersätt ‘/js/your-script.js’ med det faktiska skriptfilnamnet i ditt temas /js/-mapp.
Delen array('jquery') i koden säkerställer att jQuery laddas först.
När du har lagt till koden, scrolla ner till alternativen för ‘Infogning’ och välj ‘Hela webbplatsens sidhuvud’ för att säkerställa att skriptet laddas i rätt del av din webbplats HTML.
Klicka slutligen på knappen ‘Spara utdrag’ högst upp för att spara din anpassade kod.
Glöm sedan inte att aktivera kodavsnittet genom att växla reglaget till 'Aktiv'.
Att använda WPCode för att korrekt ladda skript säkerställer att jQuery laddas i rätt ordning. Om det var roten till problemet bör detta lösa felet.
5. Redigera wp-config.php för att åtgärda problem med jQuery-laddning
Om de andra metoderna inte har fungerat kan redigering av filen wp-config.php hjälpa genom att styra hur WordPress hanterar laddning av skript.
Denna metod är användbar om problem med skriptkonkatenering eller filvägar orsakar felet 'jQuery is not defined'.
Så här tillämpar du denna metod:
Först, öppna din wp-config.php-fil. Du kan göra detta med en FTP-klient som FileZilla eller genom att komma åt filhanteraren i din hostingkontrollpanel.
Filen wp-config.php finns i rotkatalogen för din WordPress-installation (vanligtvis i mappen public_html).
När du har hittat filen, öppna den för redigering och lägg till följande kod precis före raden som säger /* Det var allt, sluta redigera! Lycklig bloggning. */:
/** Absolute path to the WordPress directory. */
if ( !defined('ABSPATH') )
define('ABSPATH', dirname(FILE) . '/');
define('CONCATENATE_SCRIPTS', false);
Här är vad den här koden gör:
- Definitionen
ABSPATHsäkerställer att WordPress känner till den korrekta sökvägen till sina kärnfiler, vilket kan förhindra problem med jQuery-laddning. - Raden
CONCATENATE_SCRIPTSinaktiverar sammanslagning av skript. Detta tvingar WordPress att ladda varje skript separat, vilket förhindrar konflikter som uppstår när skript slås samman.
Efter att ha lagt till denna kod, spara dina ändringar och ladda om din webbplats för att se om felet har åtgärdats.
Att inaktivera skriptkonkatenering kan vara en enkel men effektiv lösning för jQuery-problem, särskilt när andra metoder inte fungerar.
Vanliga frågor om felet 'jQuery är inte definierat'
Vad betyder ‘jQuery är inte definierat’ i WordPress?
Det här felet betyder att jQuery inte laddades korrekt på din webbplats. Som ett resultat kan funktioner som är beroende av jQuery – som sliders, formulär eller menyer – inte fungera.
Är det säkert att redigera wp-config.php för att åtgärda detta?
Ja, så länge du följer våra instruktioner noggrant. Vi har testat metoden själva, och det är ett vanligt sätt att åtgärda problem med skriptladdning utan att skada din webbplats.
Kommer uppdatering av plugins och teman verkligen att åtgärda detta fel?
I många fall, ja. Vi har sett inaktuella teman eller plugins som utlöser det här felet eftersom de inte laddar jQuery korrekt eller är inkompatibla med den aktuella WordPress-versionen.
Vad händer om jag inte känner mig bekväm med att fixa detta själv?
Du kan anlita en professionell WordPress-byrå, så tar de hand om det åt dig. Om du letar efter rekommendationer, här är våra val av de bästa WordPress-supportbyråerna.
Bonusresurser: Felsökning av WordPress-fel
Om alla ovanstående steg inte hjälper eller om du vill läsa vidare, kan följande resurser vara bra utgångspunkter:
- Nybörjarguide för felsökning av WordPress-fel (steg för steg)
- Hur man korrekt lägger till JavaScript och stilar i WordPress
- De vanligaste WordPress-felen och hur du åtgärdar dem
- Hur man fixar render-blockerande JavaScript och CSS i WordPress
Vi hoppas att den här artikeln hjälpte dig att åtgärda felet 'jQuery is not defined' i WordPress. Du kanske också vill se vår guide om att uppgradera jQuery till den senaste versionen i WordPress eller vårt urval av de bästa jQuery-handledningarna för WordPress-nybörjare.
Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.
Har du en fråga eller ett förslag? Lämna gärna en kommentar för att starta diskussionen.