-1

I am working on a WordPress theme and I have included Jquery,

    // Waves
    wp_enqueue_style( 'APKMirror-wave', get_template_directory_uri() . '/inc/waves/waves.min.css');
    wp_enqueue_script(
        'APKMirror-wave',
        get_stylesheet_directory_uri() . '/inc/waves/waves.min.js',
        array( 'jquery' )
    );

    // Boostrap
    wp_enqueue_style( 'APKMirror-Bootstrap', get_template_directory_uri() . '/inc/bootstrap/bootstrap.min.css');
    wp_enqueue_script(
        'APKMirror-Bootstrap',
        get_stylesheet_directory_uri() . '/inc/bootstrap/bootstrap.min.js',
        array( 'jquery' )
    );

The problem is any time I run jQuery code I have to type the word 'jQuery' instead of just using the $. How can I change my code so that it will use $?

Grady D
  • 1,889
  • 6
  • 30
  • 61
  • http://digwp.com/2011/09/using-instead-of-jquery-in-wordpress/ – CBroe Aug 15 '14 at 03:24
  • 2
    [Duplicate 2](http://stackoverflow.com/questions/25128736/unable-to-use-get-within-wordpress-page/25128843#25128843) [Duplicate 3](http://stackoverflow.com/questions/25090615/javascript-not-loading-wordpress-footer/25090781#25090781) [Duplicate 4](http://stackoverflow.com/questions/25273501/why-isnt-enqueued-script-in-wordpress-working/25274220#25274220) [Duplicate 5](http://stackoverflow.com/questions/10154218/jquery-not-working-within-wordpress) etc. Most of these answers are by @NathanDawson - surprised he didn't flag this himself... – scrowler Aug 15 '14 at 03:31
  • Glad I was not the only one asking this question lol – Grady D Aug 15 '14 at 03:33

1 Answers1

5

jQuery in WordPress runs in noConflict mode which means the global $ shortcut for jQuery isn't available. Use the document ready wrapper which will allow $ to be used as an alias for jQuery.

jQuery(document).ready(function($) {
    // Inside here $ can be used instead of jQuery.
});

Or

(function($) {
    // Use $ here.
})(jQuery);

Thanks to Paulpro for correctly pointing out that there is an alternative that can be used if you need to run the script before the rest of the DOM loads.

Nathan Dawson
  • 18,138
  • 3
  • 52
  • 58
  • You can also use `jQuery(function($) { ... });` – Phil Aug 15 '14 at 03:25
  • 2
    -1, because you assume the OP's script should wait until the DOM is ready to run. Some scripts are important to run before the rest of DOM starts loading. If you show an alternative that doesn't wait until the DOM is ready to run, such as `(function($) { // Use $ here })(jQuery);`, I will switch the -1 to a +1. – Paul Aug 15 '14 at 03:29
  • @Paulpro - I was weighing up whether to add this alternative to the answer when writing it but you're quite right. The answer has been modified. – Nathan Dawson Aug 15 '14 at 03:49