Your slider stops sliding. Your menu won’t toggle. Your checkout page is frozen. Open the browser console, and there’s the red error: jQuery is not defined.
This error cascades through your entire site. Since half of WordPress plugins and themes depend on jQuery, when it fails, everything fails.
I’ve debugged this on e-commerce sites losing thousands per hour. The fix is usually simple—once you know where to look. Let’s get jQuery loading properly.
Why jQuery Fails to Load
Common causes:
- jQuery is loaded in the footer, but inline scripts expect it in the header
- jQuery is deregistered by a theme/plugin and not re-enqueued properly
- jQuery is loaded twice (conflict between versions)
- JavaScript aggregation/minification breaks jQuery
- CDN jQuery fails to load (network issues)
[IMAGE PLACEHOLDER: Screenshot of Chrome DevTools console showing “jQuery is not defined” error in red]
Method 1: Properly Enqueue jQuery (The Right Way)
Never hardcode jQuery in your theme. Use WordPress’s built-in system.
Step 1: Check if your theme properly enqueues jQuery. In functions.php, you should see:
php
Copy
function my_theme_scripts() {
// Enqueue jQuery (WordPress includes it by default)
wp_enqueue_script(‘jquery’);
// Your custom script that depends on jQuery
wp_enqueue_script(‘my-custom-script’, get_template_directory_uri() . ‘/js/custom.js’, array(‘jquery’), ‘1.0’, true);
}
add_action(‘wp_enqueue_scripts’, ‘my_theme_scripts’);
Step 2: If jQuery isn’t loading, force it in functions.php:
php
Copy
function force_jquery() {
wp_enqueue_script(‘jquery’);
}
add_action(‘wp_enqueue_scripts’, ‘force_jquery’, 1);
Step 3: Check if jQuery is being deregistered (common in optimization themes):
php
Copy
// REMOVE these lines if present:
wp_deregister_script(‘jquery’);
wp_register_script(‘jquery’, ‘https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js’, false, ‘3.6.0’);
If you see this, either remove it or ensure the Google CDN URL is accessible.
Method 2: Fix jQuery Loading Order
Scripts that depend on jQuery must load after it.
Step 1: Check your theme’s header.php for inline scripts:
HTML
Preview
Copy
<!– BAD: This runs before jQuery loads –>
<script>
jQuery(document).ready(function($) {
// code
});
</script>
<!– GOOD: jQuery loads first –>
<?php wp_head(); ?>
<script>
jQuery(document).ready(function($) {
// code
});
</script>
Step 2: Move inline scripts to external files and enqueue them with jQuery dependency:
php
Copy
wp_enqueue_script(‘my-script’, get_template_directory_uri() . ‘/js/my-script.js’, array(‘jquery’), ‘1.0’, true);
// ‘true’ loads in footer, after jQuery
Step 3: If you must use inline scripts, wrap them in a check:
HTML
Preview
Copy
<script>
if (typeof jQuery !== ‘undefined’) {
jQuery(document).ready(function($) {
// your code
});
} else {
console.log(‘jQuery not loaded’);
}
</script>
Method 3: Resolve jQuery Conflicts (NoConflict Mode)
Multiple jQuery versions or plugins using $ cause conflicts.
Step 1: Ensure only one jQuery loads. Check browser Network tab (F12) for multiple jquery.js or jquery.min.js files.
Step 2: If your theme loads jQuery from CDN and WordPress also loads it, deregister one:
php
Copy
function fix_jquery_conflict() {
wp_deregister_script(‘jquery’);
wp_enqueue_script(‘jquery’, ‘https://code.jquery.com/jquery-3.6.0.min.js’, array(), ‘3.6.0’, false);
}
add_action(‘wp_enqueue_scripts’, ‘fix_jquery_conflict’, 100);
Step 3: Use jQuery in noConflict mode in your custom scripts:
JavaScript
Copy
// Instead of:
$(document).ready(function() {
// code
});
// Use:
jQuery(document).ready(function($) {
// code – $ works inside here
});
Step 4: For inline scripts in content, use:
HTML
Preview
Copy
<script type=”text/javascript”>
jQuery(document).ready(function($) {
// Your jQuery code using $ here
});
</script>
Method 4: Fix Minification and Aggregation Issues
Optimization plugins often break jQuery.
For WP Rocket:
- File Optimization → JavaScript Files → Excluded JavaScript Files:
Copy
/jquery-([0-9.]+).min.js
jquery.min.js
For Autoptimize:
- JavaScript Options → Exclude scripts from Autoptimize:
Copy
jquery.js
jquery.min.js
For LiteSpeed Cache:
- Tuning → JS Excludes:
jquery
Step 2: Disable “Defer JavaScript” temporarily to test. If that fixes it, exclude jQuery from deferral:
php
Copy
// Add to functions.php
function exclude_jquery_defer($tag, $handle) {
if (‘jquery’ === $handle) {
return str_replace(‘ src’, ‘ data-cfasync=”false” src’, $tag);
}
return $tag;
}
add_filter(‘script_loader_tag’, ‘exclude_jquery_defer’, 10, 2);
Method 5: Fallback for CDN Failures
If jQuery loads from CDN and fails, provide a local fallback.
Step 1: In your theme’s functions.php:
php
Copy
function jquery_cdn_with_fallback($scripts) {
if (!is_admin()) {
$scripts->add(‘jquery’, ‘https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js’, array(), ‘3.6.0’);
$scripts->add_data(‘jquery’, ‘conditional’, ‘!window.jQuery’);
// Local fallback
wp_add_inline_script(‘jquery’, ‘window.jQuery || document.write(\'<script src=”‘ . includes_url(‘/js/jquery/jquery.min.js’) . ‘”><\/script>\’)’);
}
}
add_action(‘wp_default_scripts’, ‘jquery_cdn_with_fallback’);
Step 2: Alternatively, just use WordPress’s built-in jQuery (recommended for stability):
php
Copy
function use_local_jquery() {
wp_deregister_script(‘jquery’);
wp_register_script(‘jquery’, ‘/wp-includes/js/jquery/jquery.min.js’, false, ‘3.6.0’);
wp_enqueue_script(‘jquery’);
}
add_action(‘wp_enqueue_scripts’, ‘use_local_jquery’);
FAQs: jQuery Jitters
Why did this start after a WordPress update?
WordPress 5.5+ changed jQuery versions. Older themes/plugins using deprecated jQuery functions break. Update all themes/plugins or install Enable jQuery Migrate Helper plugin temporarily.
Can I just use vanilla JavaScript instead?
Yes, modern WordPress encourages this. But many plugins still require jQuery. Transition gradually.
Will fixing this break other scripts?
Properly enqueuing jQuery shouldn’t break anything. However, scripts that relied on jQuery being global might need the noConflict wrapper (Method 3).
Why does it work on desktop but not mobile?
Mobile browsers are stricter with JavaScript errors, or your mobile theme loads scripts differently. Check for mobile-specific script loading in your theme.
Is jQuery going away?
WordPress is reducing jQuery dependency, but it’s still included for backward compatibility. Don’t panic, but consider writing vanilla JS for new projects.
Conclusion: jQuery Restored
The “jQuery is not defined” error is a dependency management failure. By properly enqueuing scripts, managing load order, resolving conflicts, and handling minification carefully, you create a stable JavaScript environment.
JavaScript Health Checklist:
- [ ] jQuery enqueued via wp_enqueue_script
- [ ] Dependent scripts declare array(‘jquery’) dependency
- [ ] No inline scripts before wp_head()
- [ ] Minification plugins exclude jQuery
- [ ] Only one jQuery version loads
- [ ] Custom scripts use jQuery(document).ready(function($) { })
jQuery has been WordPress’s JavaScript backbone for years. Treat it with respect, load it properly, and your interactive features will work flawlessly.
