Whether or not you’re a stranger to WordPress errors or not, being met with “jQuery is not defined” whereas working in your web site is rarely enjoyable. It may be a startling and complicated message to see. Fortunately, it is a normal error that websites utilizing jQuery might expertise in some unspecified time in the future or one other.
Maybe your website is down, and once you test your browser console for errors, you see “jQuery is not defined.” Discovering the error is step one — so effectively executed!
The subsequent step is to resolve it. As a result of this is without doubt one of the extra easy JavaScript errors to repair, it shouldn’t take you very lengthy in any respect.
On this submit, we’ll stroll you thru every thing you should know to repair it quick. That features what the error means, why it could have occurred within the first place — all vital info to stop this error sooner or later. Lastly, we’ll stroll you thru just a few steps you may take to resolve it.
Let’s dive in!
What Is the “jQuery Is Not Defined” Error?
The helpful console log in your browser is the place you’ll most likely uncover this error. But it surely’s not extremely descriptive. What does “jQuery is not defined” really imply?
In plain English, this error is attempting to let you know that one thing in your website — could also be a plugin — requires jQuery to operate in your website. For some cause, when the browser tried to load the web site and referred to as for that particular jQuery, it was not accessible.
This error can probably shut down your website to guests. As a result of roughly 78% of the web sites on the web run on jQuery, it is a widespread error to seek out.
jQuery will not be outlined” error within the console log.
physique a.novashare-ctt{show:block;background:#00abf0;margin:30px auto;padding:20px 20px 20px 15px;colour:#fff;text-decoration:none!essential;box-shadow:none!essential;-webkit-box-shadow:none!essential;-moz-box-shadow:none!essential;border:none;border-left:5px strong #00abf0}physique a.novashare-ctt:hover{colour:#fff;border-left:5px strong #008cc4}physique a.novashare-ctt:visited{colour:#fff}physique a.novashare-ctt *{pointer-events:none}physique a.novashare-ctt .novashare-ctt-tweet{show:block;font-size:18px;line-height:27px;margin-bottom:10px}physique a.novashare-ctt .novashare-ctt-cta-container{show:block;overflow:hidden}physique a.novashare-ctt .novashare-ctt-cta{float:proper}physique a.novashare-ctt.novashare-ctt-cta-left .novashare-ctt-cta{float:left}physique a.novashare-ctt .novashare-ctt-cta-text{font-size:16px;line-height:16px;vertical-align:center}physique a.novashare-ctt .novashare-ctt-cta-icon{margin-left:10px;show:inline-block;vertical-align:center}physique a.novashare-ctt .novashare-ctt-cta-icon svg{vertical-align:center;peak:18px}physique a.novashare-ctt.novashare-ctt-simple{background:0 0;padding:10px 0 10px 20px;colour:preliminary}physique a.novashare-ctt.novashare-ctt-simple-alt{background:#f9f9f9;padding:20px;colour:preliminary}physique a.novashare-ctt.novashare-ctt-simple-alt:hover,physique a.novashare-ctt.novashare-ctt-simple:hover{border-left:5px strong #008cc4}physique a.novashare-ctt.novashare-ctt-simple .novashare-ctt-cta,physique a.novashare-ctt.novashare-ctt-simple-alt .novashare-ctt-cta{colour:#00abf0}physique a.novashare-ctt.novashare-ctt-simple-alt:hover .novashare-ctt-cta,physique a.novashare-ctt.novashare-ctt-simple:hover .novashare-ctt-cta{colour:#008cc4}Whether or not you’re a stranger to WordPress errors or not, being met with “jQuery is not defined” whereas working in your web site is rarely enjoyable. 
Potential Causes of the “jQuery Is Not Defined” Error
This error may be fairly a shock. Your website was working simply nice yesterday — what occurred? This is likely to be a little bit of a head-scratcher.
There are just a few attainable issues that would have occurred that threw the “jQuery is not defined” error:
- Previous plugins put in in your WordPress website are conflicting with ones that you simply put in and activated extra lately. If you happen to lately put in or activated new plugins or a few of the plugins in your website haven’t been up to date lately, this can be the trigger.
- A gradual or poor-performing internet hosting atmosphere might improve the period of time it takes your jQuery to carry out when referred to as. Double-check your server assets or error log to verify this.
- The JavaScript in your web site is working earlier than the jQuery is absolutely loaded. Or maybe a JavaScript file will not be being appropriately loaded when the web page masses.
- The CDN that you simply’re utilizing to enhance your website efficiency was unable to achieve your server. If you happen to’re not utilizing a CDN in any respect, you may rule out this chance solely.
- There’s an error or typo in your model of jQuery. Maybe somebody lately edited a core file or a plugin, which has now induced a battle.
How To Repair the “jQuery Is Not Defined” Error
Earlier than we dive into the repair, keep in mind to make a backup of your web site earlier than modifying code! Even probably the most seasoned builders make errors every so often, and having a backup available will stop you from dropping any essential work as you troubleshoot.
In case you have the choice, resolve the error on a staging or development website first, as Kinsta clients do, then verify the repair and push these adjustments stay.
When you’ve taken these crucial precautions, it’s time to repair that error.
Resolving this error takes some familiarity with including, eradicating, and modifying code. Don’t fear — you received’t want to put in writing any code from scratch. However it might assist should you had been ready to entry your website’s code, both by way of SFTP or by way of your internet hosting atmosphere.
It’s not superb for modifying code by way of the WordPress dashboard code editor. If you happen to don’t have already got a good textual content editor helpful, now’s the time to put in one.
Listed here are just a few choices you may make the most of to resolve this error and get your website again as much as guests.
Technique 1: Use the Community Tab to Debug if jQuery Is Loading
Have a look at the Community tab of your browser’s dev instruments to see if jQuery is being loaded. This offers you one place to discover a fast validation.
The choice is wanting by way of a number of plugins and themes that could possibly be inflicting the error. Undergo the code of your website and make sure that jQuery is included. It might be greatest should you solely loaded it as soon as.
If the jQuery library isn’t included, add it to your wp_enqueue_script() operate with the next snippet:
Signal Up For the Publication
wp_enqueue_script( 'tt-mobile-menu', get_template_directory_uri() .
'/js/mobile-menu.js', array('jQuery'), '1.0', true );
Find this code by going to the wp-includes folder, then open the script-loader.php file. If this doesn’t work, or should you discover that the jQuery library is, in actual fact, already included, transfer on to the next technique.
How your snippet will look within the script-loader.php file.
Technique 2: Make Positive jQuery Is Loaded
Chances are you’ll expertise the “jQuery is not defined error” when jQuery is included however not loaded. Ensure that it’s loaded by discovering the script supply and pasting the URL in a brand new browser or tab.
For instance, if the <script src= is about to this:
The snippet of textual content you must search for to seek out the URL to check.
Then, copy and paste the http://code.jquery.com/jquery-1.11.2.min.js portion into a brand new window or tab. If the jQuery file masses and exhibits you the whole contents, you may test this off your checklist.
Technique 3: Embrace Google-Hosted jQuery With a Native Fallback
It is a nice possibility to incorporate along with your JavaScript as a result of working jQuery on the localhost might enhance your web site expertise general. It can assist keep away from another CDN jQuery loading points.
Bored with subpar stage 1 WordPress internet hosting help with out the solutions? Strive our world-class help workforce! Take a look at our plans
// Fall again to a neighborhood copy of jQuery
window.jQuery || doc.write(''))
That is what your code snippet ought to appear to be in your code editor. Don’t overlook the word!
Technique 4: Add a Snippet to wp-config.php File
If not one of the above work, open up the wp-config.php file and paste within the following snippet in its entirety:
/** Absolute path to the WordPress listing. */
if ( !outlined('ABSPATH') )
outline('ABSPATH', dirname(__FILE__) . '/');
outline('CONCATENATE_SCRIPTS', false);
What the snippet will appear to be in your wp-config.php file.
Technique 5: Insert the jQuery Library Manually
As a final technique, you may go immediately into the header.php file and add the jQuery library.
Right here’s how:
- First, go to Google Hosted Libraries and replica the most recent model of the jQuery library in its entirety.
- Open up your header.php file, present in your themes folder.
- Add within the jQuery library from the first step. Be certain it goes in proper after the pinnacle tag.
- Save the file once you’re executed.
What the snippet will appear to be in your wp-config.php file.
Abstract
And there you’ve it! After following these steps, you must be capable to resolve the “jQuery is not defined” error and entry your website.
Since this drawback is often because of the browser’s incapability to attach along with your jQuery library, there are a restricted variety of options you may attempt. Most individuals discover success with any of the above choices.
If not one of the above steps have resolved the error for some cause, it’s a good suggestion to contact your internet hosting firm for help.
Have you ever encountered this error earlier than? How did you resolve it? Tell us within the feedback part!
The submit 5 Simple Methods to Repair the “jQuery is Not Defined” Error appeared first on Kinsta.