How to avoid jQuery conflicts in WordPress
Home » Blog » WordPress » How to avoid jQuery conflicts in WordPress

How to avoid jQuery conflicts in WordPress

Updated:   jQuery, WordPress 1 min read

Your support helps keep this blog running! Secure payments via Paypal and Stripe.


WordPress developers know that jQuery in WordPress runs in noConflict mode. This means when you enqueue the script that is dependent on jQuery in WordPress, you cannot use the common $ alias. To solve this issue, you can place your code using the $ shortcut inside a noConflict wrapper.

Here is an example.

  • in PHP file
<?php
/**
 * enqueue jquery library from WordPress
 */
 wp_enqueue_script("jquery");
?>
  • in JS file
(function($) {
    
 // print out $
 console.log($);
 
})( jQuery );

If you need to load the script in the header after the document is ready, you will use the code below.

jQuery(document).ready(function( $ ) {
 
 // print out $
 console.log($);
 
});

It is an issue that some new WordPress developers don’t aware of it.


Your support helps keep this blog running! Secure payments via Paypal and Stripe.


Senior WordPress & WooCommerce Developer

Senior WordPress & WooCommerce Developer

I’m a professional WordPress and WooCommerce developer based in Chiang Mai, Thailand, with over a decade of experience creating fast, secure, and scalable websites. From custom themes and plugins to full WooCommerce stores, I help businesses build a strong and reliable online presence. Need a developer you can count on? View my portfolio or get in touch to discuss your project.