Change language

5 Easy Ways to Fix the “jQuery is Not Defined” Error

5 Easy Ways to Fix the “jQuery is Not Defined” Error

Hey, there. Im Mike.

And today I wanna give you some ways to fix the jQuery is Not Defined error.

(upbeat music) Whether youre a stranger to WordPress errors or not, being met with jQuery is Not Defined while working on your website is never fun.

Luckily, this is a standard error that sites using jQuery may experience at some point or another.

In this video, well walk you through everything you need to know how to fix this error fast.

That includes what this error means and why it may have happened in the first place.

Finally, well walk you through a few steps you can take to resolve it, but before we get too far, I wanna let you know that therell be links to more resources in the video description below.

And remember, subscribe and ring that bell to get notifications for future helpful content.

So lets dive in.

This error can be quite a surprise.

Your site was working just fine yesterday. What happened? There are a few possible things that could have occurred through the jQuery is Not Defined error.

First, old plugins installed on your WordPress site are conflicting with ones that you installed and activated more recently.

If you recently installed or activated new plugins or some of the plugins on your site have not been updated recently, this may be the cause.

Two, a slow or poor-performing hosting environment could increase the amount of time it takes your jQuery to perform when called.

Double-check your server resources or error log to confirm this.

Three, the JavaScript on your website is running before the jQuery is fully loaded, or perhaps a JavaScript file is not being correctly loaded when the page loads.

Number four, the CDN that youre using to improve your site performance was unable to reach your server.

If youre not using a CDN at all, you can rule out this possibility entirely.

Number five, theres an error or typo in your version of jQuery.

Perhaps someone recently edited a core file or a plugin which has now caused a conflict.

Before we dive into the fix, remember to make a backup of your website before editing the code.

Even the most seasoned developers make mistakes now and again, and having a backup on hand will prevent you from losing any important work as you troubleshoot.

If you have the option, resolve the error on a staging or development site first as Kinsta customers do, then confirm the fix and push those changes live.

Once youve taken those necessary precautions, its time to fix that error.

Resolving this error takes some familiarity with adding, removing, and editing code.

Dont worry though, you wont need to write any code from scratch, but it would help if you were prepared to access your sites code, either through SFTP or through your hosting environment.

Its not ideal for editing code through the WordPress dashboard code editor.

If you dont already have a good text editor handy, nows the time to install one.

Here are a few options you can utilize to resolve this error and get your site back up to visitors.

Look at the network tab of your browsers dev tools to see if jQuery is being loaded.

This gives you one place to find a quick validation.

The alternative is looking through multiple plugins and themes that could be causing the error.

Go through the code of your site and ensure that jQuery is included.

It would be best if you only loaded it once.

If the jQuery library isnt included, add it to your WP in QScript function with the following snippet.

Locate this code by going to the WP includes folder, then open the scriptloader.php file.

If this doesnt work or if you find that the jQuery library is in fact already included, move on to the following method.

You may experience the jQuery is Not Defined error when jQuery is included, but not loaded.

Make sure that its loaded by finding the script source and pasting the URL in a new browser or tab.

For example, if the script source is set to this, then copy and paste this URL into a new window or tab.

If the jQuery file loads and shows you the entire content, you can then check this off your list.

This is a great option to include with your JavaScript because running jQuery on the local host may improve your website experience overall.

It will help avoid any other CDN jQuery loading issues.

If none of these other methods work, open up the wp-config.php file and paste in the following snippet in its entirety.

As a last method, you can go directly into the header.php file and add the jQuery library.

Heres how well do this.

First, go to Google hosted libraries and copy the latest version of the jQuery library in its entirety, then open up your header.php file found in your themes folder.

Add in the jQuery library from step one, make sure it goes in right after the head tag, then save the file when youre done.

Have you encountered this error before? How did you solve it? Let us know in the comment section.

Kinstas WordPress hosting can speed up your website by up to 200% and youll get 24/7 support from our expert WordPress engineers.

Let us show you the Kinsta difference.

Try a free demo of our MyKinsta dashboard at demo.kinsta.com.

Thank you for watching.

And dont forget to subscribe for more tutorials, explainers, and helpful content like this.

(upbeat music)