CODEWITHSUNDEEP
jquerywordpresswordpress-theming
aye2m
aye2m

Reputation: 131

Wordpress Child Theme jQuery conflicts with Parent Theme's jQuery

I developed a Wordpress Child Theme in which I enqueued jQuery:

wp_enqueue_script('jquery-js', '//ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js');

But it's conflicting with jQuery enqueued in the parent theme.

So, I removed the above enqueue script and added dependency in my script enqueue:

wp_enqueue_script('main-js', get_theme_file_uri('/js/scripts-bundled.js'), array('jquery'), '1.2', true);

But it didn't work (got the error "$ is not a function" in browser console). I checked the page source code and found that parent theme's scripts are loaded after my child theme's scripts.

How do I solve this issue?

Upvotes: 0

Views: 644

Answers (1)

Elvin Haci
Elvin Haci

Reputation: 3572

First approach is wrong, you should not enqueue external jQuery file.

Second approach is correct, but there is a little problem there which can be fixed one of these 2 ways:

  1. Replace all $ symbols to jQuery in js/scripts-bundled.js. And it will solve the problem. And this is more correct way than the way i write below.

  2. Disable jQuery Noconflict mode using this script: (you can add this to functions.php of your theme)

    function disable_noconflict() {
wp_add_inline_script( 'jquery-core', '$ = jQuery;' );
}
add_action( 'wp_enqueue_scripts', 'disable_noconflict' );

Upvotes: 1

Related Questions