I am trying to get some jQuery plugins to work with my custom theme.

Up until now I was doing this:

function my_scripts_method() {
  wp_deregister_script( 'jquery' );
  wp_register_script( 'jquery',    'http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js');
  wp_enqueue_script( 'jquery' );

if (!is_admin()) add_action('wp_enqueue_scripts', 'my_scripts_method');

But I've read one shouldn't deregister core bundled scripts and replace them with other versions. So I've dropped that from my functions file.

The issue is now that I've dropped that, none of my jquery scripts work. For example, my image slider. I am calling their scripts like so:

// Enqueue Nivo Slider
function maglite_add_nivo() {
    wp_enqueue_script( 'nivoslider', get_template_directory_uri() . '/js/jquery.nivo.slider.pack.js', array( 'jquery' ), false, true );
add_action( 'wp_enqueue_scripts', 'maglite_add_nivo' );

It just doesn't work now, I am guessing it has something to do with jquery not initializing or something.

I am getting some type errors in my console, which related to the nivo slider I am adding. Specifically this line: $(window).load(function() { the console says:

TypeError: 'undefined' is not a function (evaluating '$(window)')

I feel like I am missing a core step to including custom scripts that require jquery. Should I still enqueue jquery or do I not need to do anything with jquery and enqueueing?

  • 4
    See the section on noConflict wrappers in wp_enqueue_script() Codex page.
    – Milo
    Jul 3 '13 at 18:44
  • so all I had to do was change the $ to jQuery and it all seems to work now...is it really that easy?
    – Jacob
    Jul 3 '13 at 18:59
  • 4
    Yes @Jacob it is. You can even start your jQuery with jQuery(document).ready(function($) { and then you can use the $ inside that as you normally would. Jul 3 '13 at 20:04

As per comments, this kind of error is caused by the fact that WordPress loads jquery in noconflict mode. The most common workaround is to wrap all functions in your script file:

jQuery(document).ready(function($) {  ... scripts ... }

Another, more risky option is to switch off noconflict mode by starting the script file with this:

$ = jQuery.noConflict();

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.