3

This works:

add_action('wp_enqueue_scripts', 'custom_script_enqueue');
function custom_script_enqueue() {
  wp_enqueue_style(
       'customstyle',
        get_template_directory_uri() . '/css/theme.css',
        array(),
        '0.1',
        'all'
  );

  wp_enqueue_script(
     'customjs',
      get_template_directory_uri() . '/js/js.js',
      array(),
      '0.1',
      true
  );
}

But my custom JS is going to use a couple of jQuery calls. It's currently failing because jQuery is loaded after this custom script and so jQuery is coming back as being undefined on page load.

I read some answers here and tried this:

add_action('wp_enqueue_scripts', 'custom_script_enqueue');
function custom_script_enqueue() {
  wp_enqueue_style(
      'customstyle',
       get_template_directory_uri() . '/css/theme.css',
       array(),
      '0.1',
      'all'
   );

   wp_enqueue_script(
      'customjs',
      get_template_directory_uri() . '/js/js.js',
      array('jQuery'),
      '0.1',
      true
   );
}

Now, my custom script doesn't load at all. It's nowhere to be found when I view-source: on the page.

I tried replacing wp_enqueue_script with wp_register_script and then calling wp_enqueue_script('customjs'); below, but although it throws no errors, I get the same (lack of) result.

  • Note that these snippets were edited to remove the get_template_directory_uri(); for readability. – armadadrive Feb 23 '17 at 21:25
  • I'd suggest leaving get_template_directory_uri(); in the code. Use concatenation if it will help with readability. Not everyone reads the comments and there's a big difference between using get_template_directory_uri() and not, in this case. – Dave Romsey Feb 23 '17 at 21:29
  • 4
    The string for the jQuery dependency is actually, jquery (all lowercase). – Dave Romsey Feb 23 '17 at 21:29
  • 1
    @DaveRomsey That's it! Please add it as an answer and I'll mark as correct. Thanks for the comment. – armadadrive Feb 23 '17 at 22:09
4

The handle for the jQuery dependency is actually, jquery (all lowercase and case sensitivity matters).

The complete list of JavaScript handles are documented here in the Theme Developer Handbook.

  • 1
    Awesome. Those little things that trip us up when we think everything "looks right". Thanks! – armadadrive Feb 23 '17 at 22:18

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.